vue-element-admin导出数据到Excel

步骤一：安装插件

npm install xlsx file-saver -S

npm install script-loader -S -D

步骤二：在src新建目录vendor

在vendor新建文件Export2Excel.js

然后将链接中的代码复制到Export2Excel.js

https://github.com/PanJiaChen/vue-element-admin/edit/master/src/vendor/Export2Excel.js

注意：作者用的import 导入，在我的项目中打印XLSX一直是undefined，所以我用了下面的方式

import { saveAs } from 'file-saver'
// import XLSX from 'xlsx' 
const XLSX = require('xlsx');

步骤三：在vue中使用

methods: {
    exporfFile(){
        import('@/vendor/Export2Excel').then(excel => {
            // 导出的表头名信息，也就是选中列
            const tHeader = [
                '序号',
                '企业名称',
                '区县',
                '管理类别',
                '行业类别',
                '申请类型',
                '开始时间',
                '结束时间',
                '时长',
            ]
            // 导出的表头字段名，需要导出表格字段名
            const filterVal = [
                'index',
                'devcompany',
                'name_regiondetail',
                'management',
                'hyname',
                'itemtype',
                'start_time',
                'end_time',
                'time',
            ]
            //导出时如果需要序列，增加序列。
            this.tableData1.forEach((item, index) => {
                item.index = index + 1
            })
            const list = this.tableData1
            const data = this.formatJson(filterVal, list)
            excel.export_json_to_excel({
                header: tHeader, //表头 必填
                data, //具体数据 必填,字段名必须用data
                filename: 'excel-list', //非必填，自定义
                autoWidth: true, //非必填
                bookType: 'xlsx' //非必填
            })
        })
    },
    //处理数据格式将[{}……]处理为@/vendor/Export2Excel需要的[[]……]格式
    formatJson(filterVal, jsonData) {
        return jsonData.map((v) => filterVal.map((j) => v[j]))
    },
}

注意：数组的格式为数组套数组，且tHeader 元素的数量要和data中列的数量一致，且传递时注意，上面对象中橙色的属性data，一定要用'data'这个字段名，否则传递过去是undefined。

data的格式如下：

[
[1, '标题一 'George',111]
[2, '标题二', 'John', 2614,]
[3, '标题三', 'Jennifer', 4787, ]
]