vue导出excel ------------ 多级表头

先装插件 不装没人救得了你

npm install xlsx --save

<!--
 * @Author: zhang_gen_yuan
 * @Date: 2020-12-08 14:29:52
-->
<template>
  <div>
    <el-table ref="report-table" :data="tableData" style="width: 100%">
      <el-table-column prop="date" label="序号" width="150"> </el-table-column>
      <el-table-column label="名称">
        <el-table-column prop="name" label="风向" width="120">
        </el-table-column>
        <el-table-column prop="province" label="风速" width="120">
        </el-table-column>
        <el-table-column prop="city" label="温度" width="120">
        </el-table-column>
        <el-table-column prop="address" label="地址" width="300">
        </el-table-column>
        <el-table-column prop="zip" label="邮编" width="120"> </el-table-column>
      </el-table-column>
    </el-table>
    <el-button @click="exportExcel('陈奎宁')">导出</el-button>
  </div>
</template>

<script>
import FileSaver from "file-saver";
import XLSX from "xlsx";
export default {
  data() {
    return {
      tableData: [
        {
          date: "1",
          name: "15",
          province: "37",
          city: "156",
          address: "37市156金沙江路 1518 弄",
          zip: 200333,
        },
      ]
    };
  },
  methods: {
    exportExcel(excelName) {
      try {
        const $e = this.$refs["report-table"].$el;
        let $table = $e.querySelector(".el-table__fixed");
        if (!$table) {
          $table = $e;
        }
        const wb = XLSX.utils.table_to_book($table, { raw: true });
        const wbout = XLSX.write(wb, {
          bookType: "xlsx",
          bookSST: true,
          type: "array",
        });
        FileSaver.saveAs(
          new Blob([wbout], { type: "application/octet-stream" }),
          `${excelName}.xlsx`
        );
      } catch (e) {
        if (typeof console !== "undefined") console.error(e);
      }
    },
  },
};
</script>
<style>
</style>