最近后臺(tái)項(xiàng)目中有需要將游戲用戶提交的返利數(shù)據(jù)信息導(dǎo)出為excel表的形式，所以對(duì)此功能進(jìn)行了簡(jiǎn)單的總結(jié)：
1适瓦、 安裝相關(guān)依賴
主要是兩個(gè)依賴:(xlsx 和 file-saver)
npm install --save xlsx file-saver
對(duì)于這兩個(gè)插件使用撇眯，github上邊有更加詳細(xì)的參考
https://github.com/SheetJS/js-xlsx](https://github.com/SheetJS/js-xlsx)
https://github.com/eligrey/FileSaver.js](https://github.com/eligrey/FileSaver.js
2.在組件頭里邊引入插件(測(cè)試的時(shí)候，下邊代碼放到入口js文件main.js的時(shí)候沒(méi)有效果旷祸，遺留問(wèn)題，有待解決)（放到組件頭里邊能夠?qū)崿F(xiàn)效果）
import FileSaver from 'file-saver'
import XLSX from 'xlsx'
3.在對(duì)應(yīng)組件里邊methods里邊寫一個(gè)方法（到處的時(shí)候進(jìn)行調(diào)用）
exportExcel () {
/* generate workbook object from table */
let wb = XLSX.utils.table_to_book(document.querySelector('#rebateSetTable'));
/* get binary string as output */
let wbout = XLSX.write(wb, { bookType: 'xlsx', bookSST: true, type: 'array' });
try {
FileSaver.saveAs(new Blob([wbout], { type: 'application/octet-stream' }), '用戶提交返利表.xlsx');
} catch (e)
{
if (typeof console !== 'undefined')
console.log(e, wbout)
}
return wbout
},
提示：
上邊方法中：XLSX.uitls.table_to_book( 放入的是table 的DOM 節(jié)點(diǎn) ) 讼昆，sheetjs.xlsx 即為導(dǎo)出表格的名字托享，可修改！
- 點(diǎn)擊導(dǎo)出按鈕執(zhí)行 exportExcel 的方法即可 浸赫。
<div class="export">
<el-button @click="exportExcel" style="margin-top: 2px;" size="medium" type="success">導(dǎo)出</el-button>
</div>
