导出Excel

在vue项目下新建文件夹：vendor，下载以下两个js文件放入其中：

vendor

在methods中增加如下方法：

onDownload(){
                this.$confirm('确认导出excel文件吗？', '提示', {
                    type: 'warning'
                }).then(() => {
                    import('@/vendor/Export2Excel').then(excel => {
                        const tHeader = ['单位', '列一', '列二', '列三', '列四', '列五']
                        const filterVal = ['unit', 'DataOfCha', 'DataOfShang', 'plusList', 'subList', 'noCheck'];
                        const list = this.tableData;
                        const data = this.formatJson(filterVal, list);
                        excel.export_json_to_excel({
                            header: tHeader,
                            data:data,
                            filename: 'excel文件',
                            autoWidth: true
                        })
                    })
                }).catch(() => {})
            },
            formatJson(filterVal, jsonData){
                return jsonData.map(v => filterVal.map(j => {
                    return v[j];
                }))
            },

启动前后端项目，执行接口，点击导出按钮，然后问题来了，会报以下错：[Script Loader] ReferenceError: require is not defined
解决方法：
将Export2Excel.js文件中的

require('script-loader!@vendor/Blob');

改为

require('./Blob.js');

搞定！

单元格中undefined

原因为单元格对应的prop返回的数组中包含的元素为对象，可能是单元格识别不了这种类型。
我们查看ElementUI的table文档之后，发现Attributes中包含一个格式化文档的属性：formatter。
methods中添加方法：

formatData(row){
    let arr = [];
    row.data.forEach((item) => {
        arr.push(item._id + ":" + item.total)
    });
    return arr.join("\n");//加这句话数组就变成字符串了。
},

在el-table-column中添加：

<el-table-column prop="data" label="数据" :formatter="formatData" align="center" />

在style中添加以下代码，可保证上面加的换行符起作用。

<style>
    .el-table .cell{
        white-space: pre-wrap; /*保留空白符序列，但是正常地进行换行*/
    }
</style>

搞定！