antd vue export table to Excel

1. Installation dependencies

npm install -S file-saver xlsx

npm install -S script-loader

2. Introduce the js file and place it in the newly created excel folder in the src directory

Link: https://pan.baidu.com/s/11PB_IYS2Y0z5T1YKVNF0MQ Extraction code: 46h5 After copying this content, open the Baidu Netdisk mobile phone App, the operation is more convenient

 3. Introduce the two files added in main.js (the path is modified according to your own file directory)

// Export Excel

import Blob from "@/excel/Blob.js"

import Export2Excel from "@/excel/Export2Excel.js"

 4. Modify the Blob.js path in the Export2Excel.js file

5. Go back to the component you want to use the export function to prepare for export.

Write two methods in methods, as follows:

export2Excel() {
        require.ensure([], () => {
          const { export_json_to_excel } = require('../../../excel/Export2Excel');//路径需要自行修改
          let tHeader = ['指标名称', '数量'];
          let filterVal = ['lc_hz', 'sl'];
          let tTitle = '自然资源资产收支表'
          const list = this.statisticData;  //把data里的tableData存到list
          const data = this.formatJson(filterVal, list);
          export_json_to_excel(tHeader, data, tTitle);
        })
      },
      formatJson(filterVal, jsonData) {
        return jsonData.map(v => filterVal.map(j => v[j]))
      },