1. 安装插件

npm install --save xlsx@0.17.3
npm install --save file-saver@2.0.5

2. 新建一个js文件夹放编写的js

在src下新建htmlToExcel.js文件

然后再htmlToExcel.js下编写咱们的代码

import FileSaver from 'file-saver';
import XLSX from 'xlsx';
export default {
  // 导出Excel表格
  exportExcel(name, tableName) {
    //name表示生成excel的文件名     tableName表示表格的id
    var sel = XLSX.utils.table_to_book(document.querySelector(tableName))
    var selIn = XLSX.write(sel, { bookType: 'xlsx', bookSST: true, type: 'array' })
    try {
      FileSaver.saveAs(new Blob([selIn], { type: 'application/octet-stream' }), name)
    } catch (e) {
      if (typeof console !== 'undefined') console.log(e, selIn) 
    }
    return selIn
  }
};

3. 页面编写代码

1. 导入js文件

下面是我的路径，请选择你自己的路径

import htmlToExcel from '../../../excel/htmlToExcel';

2. 书写id

这里得写（id = "tableData"）

<el-table :data="tableData" style="width: 1300px;margin-top: 20px;" v-if="dataShow == true" id = "tableData">

3. 按钮

<el-button @click="exportExcel">导出</el-button>

4. 执行方法

const exportExcel = () => {
	htmlToExcel.exportExcel("汇总成绩报告.xlsx", "#tableData");
}

return {
    exportExcel
}

测试下载即可