vue中实现table数据导出为excel

首先

安装几个依赖,命令如下:

npm install -S file-saver

npm install -S xlsx

npm install -D script-loader

然后

在src 下新建文件夹,我们这里文件夹名字暂定为excel,这里需要放两个js文件,分别是Blob.js 和 export2Excel.js

网盘地址:https://pan.baidu.com/s/1QsyIWTgw9iLmb3uBMIyGww   提取码:2021

最后

在methods中

    exportExcel() {

      var that = this

      require.ensure([], () => {

        const { export_json_to_excel } = require('@/excel/export2Excel') //这里必须使用绝对路径,使用@/+存放export2Excel的路径

        const tHeader = ['姓名', '性别', '警号', '分数', '作答时间','所在单位','是否批改','是否提交'] // 导出的表头名信息

        const filterVal = [

          'name',

          'sex',

          'code',

          'sumScore',

          'minute',

          'deptName',

          'isCorrect',

          'isSubmit',

        ] // 导出的表头字段名,需要导出表格字段名

        const list = that.ExaminersTable //这里对应你页面表格的数据

        const data = that.formatJson(filterVal, list)

        export_json_to_excel(tHeader, data, '成绩详情excel') // 导出的表格名称,根据需要自己命名

      })

    },

    //格式转换,直接复制即可

    formatJson(filterVal, jsonData) {

      return jsonData.map((v) => filterVal.map((j) => v[j]))

    },

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容