vue2.0+element-ui+js-xlsx.js+fileSaver.js匯出表格到Excel出現重複表格解決辦法
阿新 • • 發佈:2019-01-08
如果element-ui的table使用了fixed屬性固定列,匯出表格時會出現匯出兩次的問題,是因為在table中有兩個table標籤,我們可以通過程式碼解決這個問題,注意程式碼中拷貝了一個table元素,否則直接刪除會刪除頁面中的表格
output(tableID) { /* generate workbook object from table */ let table = document.querySelector("#"+tableID).cloneNode(true); // 因為element-ui的表格的fixed屬性導致多出一個table,會下載重複內容,這裡刪除掉 table.removeChild(table.querySelector(".el-table__fixed")) let wb = XLSX.utils.table_to_book(table,{raw:true});//mytable為表格的id名 /* get binary string as output */ let excName = this.companyReport; if (this.dataEndDate) { excName += '('+this.dataEndDate+')' } let wbout = XLSX.write(wb, { bookType: "xlsx", bookSST: true, type: "array", }); try { FileSaver.saveAs( new Blob([wbout], { type: "application/octet-stream" }), excName+".xlsx" ); } catch (e) { if (typeof console !== "undefined") console.log(e, wbout); } return wbout; },