vue中导出excel表格

在vue的项目中有个导出excel的需求 之前是后台做的给个地址进行下载。查阅了下资料，前端实现也不难，记录下来，备用。

1 安装依赖
npm install -S file-saver xlsx
npm install -D script-loader

2 安放两个js文件

在src下新建一个文件夹引入Blob.js和expor2Excal.js
3 在methods中写导出的函数
exportExcel(){
import(’@/vendor/Export2Excel’).then(excel => {
const tHeader = [‘水表编号’, ‘用户编号’, ‘用户地址’, ‘集中器编号’, ‘抄表日期’, ‘原始读数’, ‘修正读数’]
const filterVal = [‘code’, ‘usn’, ‘position’, ‘concentrator’, ‘daytime’, ‘lvalue’, ‘fixValue’]
const list = this.historyData.list
const data = this.formatJson(filterVal, list)
excel.export_json_to_excel({
header: tHeader,
data, }) })},
formatJson(filterVal, jsonData) {
return jsonData.map(v => filterVal.map(j => {
return v[j]
}))},

其中tHeader是表头，filterVal 中的数据是表格的字段 @文件位置在src

js文件下载：https://pan.baidu.com/s/1_X2uhXSyb9xfGw87eDFGrw

---

本文来自 Ace_with_Yu 的CSDN 博客 ，全文地址请点击：https://blog.csdn.net/ace_with_yu/article/details/82872747?utm_source=copy