工具使用：npm install file-saver xlsx --save-dev
import { exportExcel } from "@/utils/util";
import XLSX from "xlsx";
/** * 导出为excel * @param {*} node 表格节点 * @param {*} filename 导出文件名 */ export function exportExcel (filename, wb) { var wbout = XLSX.write(wb, { bookType: "xlsx", bookSST: true, type: "array" }); try { FileSaver.saveAs( new Blob([wbout], { type: "application/octet-stream" }), filename + ".xlsx" ); } catch (e) { if (typeof console !== "undefined") console.log(e, wbout); } return wbout; } export default {};
使用：
exportExcelXLSX() {
let workbook = XLSX.utils.book_new();
let ws = XLSX.utils.table_to_sheet(this.$refs.tableDisplay.$el, {
raw: true,
});
XLSX.utils.book_append_sheet(workbook, ws, "sheet1");
exportExcel("设备表", workbook);
},
此方法不导出所有 只导出当前页面
到处所有可以以totalsize为参数 渲染所有列表并隐藏
<el-table :data="tableDataDisplay" cell-class-name="table-field-body" header-cell-class-name="table-field-head" height="100%" highlight-current-row ref="tableDisplay" tooltip-effect="light" @selection-change="handleSelectionChange" v-show="false" >
async excelOut() { this.tableDataDisplay = []; try { const { totalSize } = this; const res = await getSbzl({ index: 1, pageSize: totalSize, }); if (res.code == 1) { const { records } = res.data; this.tableDataDisplay = [...records]; this.$nextTick(() => { this.exportExcelXLSX(); }); } } catch (error) {} },
原文：https://www.cnblogs.com/qjh0208/p/14652089.html