前端实现 EXCEL表导出

工具使用: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);
    },

此方法不导出所有  只导出当前页面table表格

导出所有  简单粗暴的方法  直接display一个table表   表内为请求的所有数据

然后绑定导出方法的绑定值为隐藏表格

  

原文地址:https://www.cnblogs.com/qjh0208/p/14652089.html