vue项目中如何把数据导出成excel文件

关于vue中如何把数据导出成excel文件

1. 安装依赖

yarn add file-saver
yarn add xlsx
yarn add script-loader --dev

2. 导入两个JS文件

链接:https://pan.baidu.com/s/1NajDSjBl7FC4SagaipOtqA 密码:ryab
下载Blob.js和Export2Excel.js,在src目录下新建Excel文件夹,里面放入Blob.js和Export2Excel.js两个JS文件

3. 在组件中使用

在methods中添加下面两个方法

  //导出的方法
    exportExcel() {
      require.ensure([], () => {
        const { export_json_to_excel } = require("../../excel/Export2Excel");
        const tHeader = ["用户名", "操作类型", "操作时间", '操作内容'];
        // 上面设置Excel的表格第一行的标题
        const filterVal = ["operationName", "operationType", "operationDate",'operationMsg'];
        // 上面的index、nickName、name是tableData里对象的属性
        const list = this.tableData; //把data里的tableData存到list
        const data = this.formatJson(filterVal, list);
        export_json_to_excel(tHeader, data, "核身操作日志");
      });
    },

    formatJson(filterVal, jsonData) {
      return jsonData.map(v => filterVal.map(j => v[j]));
    }
Last modification:November 25th, 2019 at 07:13 pm
If you think my article is useful to you, please feel free to appreciate

Leave a Comment