前端利用XLSX插件进行表格下载，当遇到分页时下载的表格只能下载第一页数据问题处理方法

最近做了个项目，用纯前端下载表格，后端返回了所有数据，但是前端给强行分页为多页，当只有一页时下载正常，但是有多页时只能下载第一页数据，这个时候翻阅资料，发现很多都是，将分页条数设置为表格数据总条数，将表格变为一页去下载，等下载完后再恢复以前的分页大小。该方法试了，可以实现下载全部数据，但是由于分页条数发生改变，在前端交互时页面表格会出现变化，个人感觉体验不是很好。但是如果对样式变化不在意的话，还是可以采纳的。（另外，如果实在要用这种方法，是否可以考虑将实际分页的模块隐藏起来，然后作个假的，此法费力），不过我这个后来还是采用了后端接口下载表格。此处写前端下载表格，以供实际需要的朋友使用参考。

利用纯前端下载表格，首先引入以下组件：

import FileSaver from 'file-saver'
import XLSX from 'xlsx'

具体主要代码：

 // 点击下载表格
 exportExcel() {
      this.oldPageSize = this.pageSize // 记录下一开始分页的每页大小
      this.pageSize = this.tableData.length // 由于假分页所以将分页大小设置为表格包含总数据条数，使前端展示的只有一页数据
      setTimeout(() => {
        this.handleExport() // 开始真正的下载
      }, 1000)
    },
    // 导出表格
    handleExport() {
      var id = '#' + this.id // 前端表格对应id
      // ----普通导出
      let tableDom, tableName
      tableDom = document.querySelector(id)
      // 表名 = **表 +下载时间
      tableName = (this.title || this.$route.meta.title) + '_' + new Date().Format('yyyy-MM-dd hh:mm:ss') + '.xlsx'
      var wb = XLSX.utils.table_to_book(tableDom, { raw: true })
      /* get binary string as output */
      var wbout = XLSX.write(wb, { bookType: 'xlsx', bookSST: true, type: 'array' })
      try {
        FileSaver.saveAs(new Blob([wbout], { type: 'application/octet-stream' }), tableName)
      } catch (e) {
        if (typeof console !== 'undefined') console.log(e, wbout)
      }
      // ---以上为普通
      // ❤恢复之前的pageSize-每页条数的值，还原表格
      setTimeout(() => {
        this.pageSize = this.oldPageSize
      }, 1000)
      return wbout
    }