vue纯前端直接导出table表格，无需接口直接导出excel

最新推荐文章于 2024-12-16 15:15:07 发布

diCommon

最新推荐文章于 2024-12-16 15:15:07 发布

阅读量2.2k

点赞数 4

分类专栏： js vue 文章标签： vue.js javascript

本文链接：https://blog.csdn.net/u010613970/article/details/124349253

版权

js 同时被 2 个专栏收录

18 篇文章 1 订阅

订阅专栏

vue

9 篇文章 0 订阅

订阅专栏

将前端 table 导出 excel

npm install table-excel
import { ElMapExportTable } from "table-excel";

下面的方法用的比较多，其他的就不写上来了，可以直接去官方的git地址查看

导出正常表格到 Excel

handleGo(){
  var data = this.tableCfg.tableData; // 这里面是数据列表
  const column = [
    { title: "设备名称", dataIndex: "device_name" }, // dataIndex为数据列表中的数据字段
    { title: "设备MAC码", dataIndex: "device_no" },
    { title: "报警时间", dataIndex: "add_time" },
    { title: "日志内容", dataIndex: "log_text" },
    { title: "设备地址", dataIndex: "device_address" },
  ];
  const instance = new ElMapExportTable(
    { column, data },
    { progress: progress => console.log(progress) }// 进度条回调
  );
  instance.download("设备日志"); // 导出的文件名
}