vue-element-admin table表格匯出(含踩坑)
阿新 • • 發佈:2022-11-29
步驟一:安裝外掛
npm install xlsx file-saver -S
npm install script-loader -S -D
步驟二:在src新建目錄vendor
在vendor新建檔案Export2Excel.js
然後將連結中的程式碼複製到Export2Excel.js
https://github.com/PanJiaChen/vue-element-admin/edit/master/src/vendor/Export2Excel.js
注意:作者用的import 匯入,在我的專案中列印XLSX一直是undefined,所以我用了下面的方式
import { saveAs } from 'file-saver' // import XLSX from 'xlsx' const XLSX = require('xlsx');//匯出時如果需要序列,增加序列。 this.tableData1.forEach((item, index) => { item.index = index + 1 }) const list = this.tableData1 const data = this.formatJson(filterVal, list)
excel.export_json_to_excel({ header: tHeader, //表頭 必填 data, //具體資料 必填,欄位名必須用data filename: 'excel-list', //非必填,自定義 autoWidth: true, //非必填 bookType: 'xlsx' //非必填 }) }) }, //處理資料格式將[{}……]處理為@/vendor/Export2Excel需要的[[]……]格式 formatJson
[1, '標題一 'George',111]
[2, '標題二', 'John', 2614,]
[3, '標題三', 'Jennifer', 4787, ]