纯前端el-table导出excel使用xlsx插件

1、安装依赖

npm install --save xlsx file-saver

2、在要用到的文件中引入

<script>
import FileSaver from 'file-saver';
import XLSX from 'xlsx'
</script>

3、添加导出按钮

<el-button type="warning" icon="Download" @click="handleExport" plain>导出</el-button>

4、给table添加id：“table-data”

<el-table
      border
      id="table-data"
      :data="tableData">
      ...
</el-table>

4、导出方法

// 导出
const handleExport = () => {
  var wb = XLSX.utils.table_to_book(document.querySelector('#table-data'));//关联dom节点
  /* 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'
    }), '设备需求申请单_' + new Date().getTime() + '.xlsx')//自定义文件名
  } catch (e) {
    if (typeof console !== 'undefined') console.log(e, wbout);
  }
  return wbout
}