vue+element导出表格

1.安装插件

npm i -S pikaz-excel-js

 2.封装的一个导出插件

<template>
  <div>
    <excel-export :sheet="sheet">
      <el-button type="primary">导出</el-button>
    </excel-export>
  </div>
</template>

<script>
import { ExcelExport } from "pikaz-excel-js";
export default {
  props: {
    sheetName: {
      type: String,
      default: "222",
    },
    tableTitle: {
      type: String,
    },
    tableData: {
      type: Array,
      required: true,
    },
    keys: {
      type: Array,
      required: true,
    },
    tHeader: {
      type: Array,
      required: true,
    },
  },
  data() {
    return {
      sheet: [
        {
          title: this.tableTitle,
          keys: this.keys,
          table: this.tableData,
          tHeader:this.tHeader
        },
      ],
    };
  },
  components: { ExcelExport },
  methods: {},
  created() {
    // console.log(this.tableData);
  },
};
</script>

<style>
</style>

3.需要使用导出的页面引用注册一下

4.使用，与传值 props

        <dao-chu :sheet-name="sheetName" :table-data="tableData" :tHeader="tHeader" :keys="keys" :tableTitle="title"></dao-chu>