el-table中数据的导出

95 阅读1分钟

首先需要安装两个相关依赖:

npm install --save xlsx file-saver

在页面中引入依赖:

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

代码如下:

 exportExcel() {
     var fix =document.querySelector("#outTable .el-table__fixed")
      var wb 
      if(fix){
        wb = XLSX.utils.table_to_book(document.querySelector("#outTable").removeChild(fix),{raw:true});
        document.querySelector("#outTable").appendChild(fix)
      }else{
         wb = XLSX.utils.table_to_book(document.querySelector("#outTable").removeChild(fix),{raw:true});
      }
        var wbout = XLSX.write(wb, {bookType: 'xlsx', bookSST: true, type: 'array'});
          try {
            FileSaver.saveAs(
                new Blob([wbout], {
                  type: 'application/octet-stream'
                  }),
                  //设置导出文件名称
                  '每日汇总.xlsx');
                  } catch (e) {
                    console.log(e, wbout);
                    }
                    this.downloadLoading = false;
                    return wbout;
     },     

就ok啦,原理先不管 mark一下