导出表格功能
依赖包安装
1
2
| npm install -S file-saver xlsx
npm install -D script-loader
|
下载 Blob.js 和 export2Excel.js，放到同一个文件夹
修改 export2Excel.js,否则第一次点击导出时会报错
1
2
3
| require('script-loader!file-saver');
require('./Blob');
require('script-loader!xlsx/dist/xlsx.core.min');
|
获取数据
1
2
3
4
5
6
7
8
9
10
11
12
| exportData() {
let param={
id :123123
}
this.$axios.get('/api/test').then( res =>{
console.log(res)
this.exportList=res.returnObj;
this.handleDownload();
}).catch(err =>{
console.log(err)
})
},
|
导出
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
| handleDownload() {
console.log(666)
require.ensure([], () => {
const { export_json_to_excel } = require('@/utils/export2Excel'); //引入文件
const tHeader = ['名称', '邮箱','类型']; //将对应的属性名转换成中文
const filterVal = ['Company', 'Email','Type'];//table表格中对应的属性名
const list = this.exportList.map(item=>{
if(item.Type==='1'){
item.Type="A类"
}else if(item.Type==='2'){
item.Type="B类"
}else if(item.Type==='0'){
item.Type="C类"
}
return item;
});
console.log(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]))
}
|