vue+element将数据导出成excel表格

329 阅读1分钟

 
1.首先先安装

npm install --save xlsx file-saver

2.在当前的组件引入

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

3.给Table的组件添加一个id (这里我给的)

<el-table ref="multipleTable" :data="tableData" id="exportTab" stripe  tooltip-effect="dark" style="width: 100%">

  1. js代码看一下
exportExcel () {
      // /* generate workbook object from table */
      var xlsxParam = { raw: true } // 导出的内容只做解析,不进行格式转换
      var wb = XLSX.utils.table_to_book(document.querySelector('#exportTab'), xlsxParam)


      /* 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' }), '审核情况表.xlsx')
      } catch (e) {
        if (typeof console !== 'undefined') {
          console.log(e, wbout)
        }
      }
      return wbout
},

推荐前端面试题库小程序 MST题宝库

喜欢记得「点赞」或「在看」,让我们一起成长。