Vue 实战-5 批量导出 excel功能
需求，需要一键导出，但是这个有点low，即不能自定义，即我只想导出我想要的数据而不是全部怎么办？
参考连接：https://blog.csdn.net/qq_42616672/article/details/108803898
先总结如下：
1.需要安装依赖：file-saver xlsx script-loader
命令：cnpm/ npm install -S file-saver
cnpm/npm install -S xlsx
cnpm/npm install -D script-loader
2.需要导入两个js文件，前提在src目录下新建一个文件夹Excel(可以随意，但是推荐是这个便于管理)
Blob.js 和 Export2Excel.js 把这两个js文件放入Excel文件夹中；
3.在main.js中引入
import Blob from './Excel/Blob.js'
import Export2Excel from './Excel/Export2Excel.js'
4.组件中使用
第一：写一个button绑定点击事件ExportToExcel
第二：写一绑定好的方法
代码：
ExportToExcel () {
// let wb = XLSX.utils.table_to_book(document.querySelector('#table_data')); // 这里就是表格
// let wbout = XLSX.write(wb, { bookType: 'xlsx', bookSST: true, type: 'array' });
// try {
// FileSaver.saveAs(new Blob([wbout], { type: 'application/octet-stream' }), 'test.xlsx'); //test是自己导出文件时的命名，随意
// } catch (e)
// {
// if (typeof console !== 'undefined')
// console.log(e, wbout)
// }
// return wbout
上面注释的代码可以实现导出当前页面所有数据，但是没办法满足需求，故有下面的代码：
require.ensure([], () => {
const { export_json_to_excel } = require('../Excel/Export2Excel');//注意这个Export2Excel路径
const tHeader = ['域名', '负责人', '集群', '是否分享域名']; // 上面设置Excel的表格第一行的标题
const filterVal = ['uniq_domain', 'owner', 'cluster', 'is_share']; // 上面的index、nickName、name是tableData里对象的属性key值
const list = this.multipleSelection; //把要导出的数据tableData存到list
const data = this.formatJson(filterVal, list);
export_json_to_excel(tHeader, data, 'test_guos');//最后一个是表名字
})
},
formatJson(filterVal, jsonData) { // 这个是上一个方法需要调用的
return jsonData.map(v => filterVal.map(j => v[j]))
},