1500字范文,内容丰富有趣,写作好帮手!
1500字范文 > vue2 使用 Export2Excel.js 前端导出数据为 excel 文件记录

vue2 使用 Export2Excel.js 前端导出数据为 excel 文件记录

时间:2024-07-18 08:16:52

相关推荐

vue2 使用 Export2Excel.js 前端导出数据为 excel 文件记录

1、将 export2Excel.js 内容复制到项目本地文件中

export2Excel.js 地址:

/PanJiaChen/vue-element-admin/blob/master/src/vendor/Export2Excel.js

2、安装xlsxfile-saver依赖

npm install --s xlsx@0.17.5npm install --s file-saver@2.0.5

3、组件当中使用

主要入参是 表头数据和内容数据源。

// 下载为excelexportExcel () {try {// {分项名称}+{统计时段}+“能耗报表”+{导出时间(YYMMDDMMSS)}.xlxs// 文件名称const nowTime = formatDate(new Date(), 'yyMMddhhmm')const filename = `能耗报表${nowTime}`// 获取表头和数据const {headList, tableData } = this.$refs.EchartsViewRef.$refs.TableChartsRefconst tHeader = headList.map(item => item.title) // 表格头部 ['时间','总量']const tData = [...tableData]const filterVal = headList.map(item => item.key) // 展示数据里哪些字 ['time','data']const data = this.formatJson(filterVal, tData) // 过滤掉不使用的数据字段// 文件数据处理完成后自动下载export_json_to_excel({header: tHeader, // 表头data,filename, // 文件名称autoWidth: true,bookType: 'xlsx' // 文件后缀名})} catch (error) {console.log(error)}},

/*** 格式数据,对象数据格式 转为 json格式* @filterVal 格式头* @tableData 用来格式的表格数据*/formatJson (filterVal, jsonData) {return jsonData.map(v => filterVal.map(j => v[j]))}

效果

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。