vue element-ui 导出

安装依赖

import * as XLSX from 'xlsx';
import FileSaver from "file-saver";

表格需要添加id="multipleTable"

<el-button type="primary" @click="exportFun">导出</el-button>  
  <el-table
          id="multipleTable"
          :data="tableData"
          :loading="listLoading"
          max-height="500px"
          style="width: 100%">
        <el-table-column
            label="序号"
            type="index"
            width="50">
        </el-table-column>
        <el-table-column label="行政区划" prop="regionName"/>
        <el-table-column label="全部" prop="wholeCount"/>
        <el-table-column label="已发布" prop="publishedCount"/>
      </el-table>

导出方法

关键地方，document.getElementById("multipleTable") ，id需要使用element table上定义的id

exportFun() {
    const xlsxParam = {raw: true};//转换成excel时，使用原始的格式(防止科学技术法的出现)
    let wb = XLSX.utils.table_to_book(
        document.getElementById("multipleTable"), xlsxParam
    ); // 这里就是表格
    let wbout = XLSX.write(wb, {
      bookType: "xlsx",
      bookSST: true,
      type: "array",
    });
    try {
      FileSaver.saveAs(
          new Blob([wbout], {type: "application/octet-stream;charset=utf-8"}),
          "导出数据.xlsx"
      );
    } catch (e) {
      if (typeof console !== "undefined") console.log(e, wbout);
    }
  },