注意：在開始之前，先進行插件安裝，參考：https://www.cnblogs.com/zhoulifeng/p/9974735.html
第二步：更改export2Excel.js里面的源碼，本文示例為3級表頭，可以根據(jù)需求，自行更改
//此處源碼已被修改，autoWidt和bookType參數(shù)，先默認，（可以通過傳參修改）
export?function?export_json_to_excel(excelData,?autoWidth?=?true,?bookType?=?'xlsx')?{
??/*?original?data?*/
??let?multiHeader?=?excelData.multiHeader;?//?第一級標題
??let?multiHeader2?=?excelData.multiHeader2;?//?第二級標題
??let?header?=?excelData.tHeader;?//?第三級標題
??let?data?=?excelData.transData;?//?table數(shù)據(jù)
??let?defaultTitle?=?excelData.defaultTitle;?//?excel表的標題
??let?merges?=?excelData.merges;?//?excel表合并單元格
??//?console.log(multiHeader);
??//?console.log(multiHeader2);
??//?console.log(header);
??//?console.log(data);
??//?console.log(defaultTitle);
??//?console.log(merges);
??data.unshift(header);
??//此處是第二行表頭
??for?(let?i?=?multiHeader2.length?-?1;?i?>?-1;?i--)?{
????data.unshift(multiHeader2[i])
??}
??//此處是第一行行表頭
??for?(let?i?=?multiHeader.length?-?1;?i?>?-1;?i--)?{
????data.unshift(multiHeader[i])
??}
??var?ws_name?=?"SheetJS";
??var?wb?=?new?Workbook(),
????ws?=?sheet_from_array_of_arrays(data);
??//合并excel單元格和設置表格寬度
??if?(merges.length?>?0)?{
????if?(!ws['!merges'])?ws['!merges']?=?[];
????merges.forEach(item?=>?{
??????ws['!merges'].push(XLSX.utils.decode_range(item))
????})
??}
??if?(autoWidth)?{
????/*設置worksheet每列的最大寬度*/
????const?colWidth?=?data.map(row?=>?row.map(val?=>?{
??????/*先判斷是否為null/undefined*/
??????if?(val?==?null)?{
????????return?{
??????????'wch':?10
????????};
??????}
??????/*再判斷是否為中文*/
??????else?if?(val.toString().charCodeAt(0)?>?255)?{
????????return?{
??????????'wch':?val.toString().length?*?2
????????};
??????}?else?{
????????return?{
??????????'wch':?val.toString().length
????????};
??????}
????}))
????/*以第一行為初始值*/
????let?result?=?colWidth[0];
????for?(let?i?=?1;?i?<?colWidth.length;?i++)?{
??????for?(let?j?=?0;?j?<?colWidth[i].length;?j++)?{
????????if?(result[j]['wch']?<?colWidth[i][j]['wch'])?{
??????????result[j]['wch']?=?colWidth[i][j]['wch'];
????????}
??????}
????}
????ws['!cols']?=?result;
??}
??//--------------------------------------------------------
??/*?add?worksheet?to?workbook?*/
??wb.SheetNames.push(ws_name);
??wb.Sheets[ws_name]?=?ws;
??var?wbout?=?XLSX.write(wb,?{
????bookType:?'xlsx',
????bookSST:?false,
????type:?'binary'
??});
??var?title?=?defaultTitle?||?'列表'
??saveAs(new?Blob([s2ab(wbout)],?{
????type:?"application/octet-stream"
??}),?title?+?".xlsx")
}
第三步：元素，及頁面method里添加的方法
<Button?type="success"?style="margin-right:5px;"?@click="exportmulti">導出</Button>
exportmulti()?{
??????import("@/exportExcel/Export2Excel2").then(excel?=>?{
????????const?multiHeader?=?[
??????????[
????????????"企業(yè)名稱",
????????????"電子收費金額",
????????????"",
????????????"",
????????????"",
????????????"應退款金額",
????????????"",
????????????"",
????????????"",
????????????"",
????????????"",
????????????"",
????????????"",
????????????"",
????????????"電子收費資金明細分類",
????????????"",
????????????"",
????????????"",
????????????"",
????????????"",
????????????"",
????????????"",
????????????""
??????????]
????????];
????????const?multiHeader2?=?[
??????????[
????????????"",
????????????"微信公眾商戶平臺",
????????????"微信開放商戶平臺",
????????????"支付寶",
????????????"合計",
????????????"2016.9.1前",
????????????"",
????????????"2016.9.1-2017.12.31",
????????????"",
????????????"2018.1.1-2019.12.31",
????????????"",
????????????"2020.1.1后",
????????????"",
????????????"合計",
????????????"2016.9.1前",
????????????"",
????????????"2016.9.1-2017.12.31",
????????????"",
????????????"2018.1.1-2019.12.31",
????????????"",
????????????"實收",
????????????"",
????????????"合計"
??????????]
????????];
????????const?tHeader?=?[
??????????"",
??????????"",
??????????"",
??????????"",
??????????"",
??????????"微信",
??????????"支付寶",
??????????"微信",
??????????"支付寶",
??????????"微信",
??????????"支付寶",
??????????"微信",
??????????"支付寶",
??????????"",
??????????"微信",
??????????"支付寶",
??????????"微信",
??????????"支付寶",
??????????"微信",
??????????"支付寶",
??????????"微信",
??????????"支付寶",
??????????""
????????];
????????//?table對應導入字段
????????const?filterVal?=?[
??????????"companyName",
??????????"eWeChatMountApp",
??????????"eWeChatMountApp",
??????????"eAlipay",
??????????"eTotal",
??????????"reWeChatBefore",
??????????"reAlipayBefore",
??????????"reWeChatBe",
??????????"reAlipayBe",
??????????"reWeChatTe",
??????????"reAlipayTe",
??????????"reWeChatAf",
??????????"reAlipayAf",
??????????"reTotal",
??????????"deWeChatBefore",
??????????"deAlipayBefore",
??????????"deWeChatBe",
??????????"deAlipayBe",
??????????"deWeChatTe",
??????????"deAlipayTe",
??????????"deWeChatAf",
??????????"deAlipayAf",
??????????"deTotal"
????????];
????????let?list?=?this.capitalStatementData;
????????// table數(shù)據(jù)轉(zhuǎn)換
????????const?data?=?this.formatJson(filterVal,?list);
????????//進行所有表頭的單元格合并，建議一行一行來，不然容易整亂
????????const?merges?=?[
??????????"A1:A3",
??????????"B1:E1",
??????????"B2:B3",
??????????"C2:C3",
??????????"D2:D3",
??????????"E2:E3",
??????????"F1:N1",
??????????"F2:G2",
??????????"H2:I2",
??????????"J2:K2",
??????????"L2:M2",
??????????"N2:N3",
??????????"O1:W1",
??????????"O2:P2",
??????????"Q2:R2",
??????????"S2:T2",
??????????"U2:V2",
??????????"W2:W3"
????????];
????????//?導出excel表，的標題
????????const?defaultTitle?=?"各企業(yè)資金統(tǒng)計";
????????//?按照順序傳參
????????excel.export_json_to_excel({
??????????multiHeader,?//這里是第一行的表頭
??????????multiHeader2,?//這里是第二行的表頭
??????????tHeader,?//這里應該是算第三行的表頭
??????????data,?//?表格數(shù)據(jù)
??????????defaultTitle,?//?excel表的名稱
??????????merges?//?合并excel單元格
????????});
??????});
????},
????/*?轉(zhuǎn)換table數(shù)據(jù)，以便正確導出數(shù)據(jù)
????-------------------------------------------------------------------*/
????formatJson(filterVal,?jsonData)?{
??????return?jsonData.map(v?=>
????????filterVal.map(j?=>?{
??????????if?(j?!==?"companyName")?{
????????????return parseTime(v[j]);
??????????}?else?{
????????????return?v[j];
??????????}
????????})
??????);
????},
