加入依赖
npm install --save xlsx file-saver
在需要导出的表格文件导入js
import FileSaver from 'file-saver'
import * as XLSX from 'xlsx'
编写导出的js
exportExcel() {
var wb = XLSX.utils.table_to_book(document.querySelector("#out-table"));
var 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;
},
对表格增加id
<el-table
id="out-table"
:data="tableData"
stripe
style="width: 100%">
<el-table-column
prop="cardId"
label="序号"
>
</el-table-column>
</el-table>
添加导出按钮
<el-button @click="exportExcel">点击导出</el-button>