摘要：
实现思路 实现思路使用json2csv将后台json数据转化为csv格式数据采用创建Blob（二进制大对象）的方式来存放缓存数据；生成下载链接；创建一个a标签，设置href和download属性触发a标签的点击事件实现下载实现如下：表格为假设数据格式如下：（实现子集数据也可导出成一条数据）listdata：[{
使用json2csv将后台json数据转化为csv格式数据
- 采用创建Blob（二进制大对象）的方式来存放缓存数据；生成下载链接；
创建一个a标签，设置href和download属性
触发a标签的点击事件实现下载
实现如下：
表格为 <Table :columns="columns" :data="listdata"></Table>
假设数据格式如下： （实现子集数据也可导出成一条数据）
listdata： [{AreaName: '区域1',ProjectManager: '小丽',ProjectName:'区域1项目',money: 6666，
children：{AreaName: '区域1',ProjectManager: '小1',ProjectName:'项目1',money: 1236，}}, // 当存在子集数据时
{AreaName: '区域2',ProjectManager: '小红',ProjectName:'区域2项目',money: 8866}],columns: [{title: '所属区域',key: 'AreaName'},{title: '负责人',key: 'ProjectManager'},{title: '项目名称',key: 'ProjectName'},{title: '金额',key: 'money'}],
实现代码：
//先将子集数据处理为第一层级数据 ListDataSplit (listData, newData) { listData.map((item, index) =>{ if (item.children &&item.children.length) { newData.push(item) this.ListDataSplit(item.children, newData) } else{ newData.push(item) } }) },
// 导出
export () {
if (this.listData.length < 0) {
this.$Message.warning('数据为空')
return
}
let newData = []
this.ListDataSplit(this.listData, newData)
//处理完数据后，调用导出的方法
this.exportFn(newData, this.columns)
}，
//导出方法 exportFn (listdata, columns) { let Parser = require('json2csv').Parser let fields =[] columns.map(col =>{ if (col.title &&col.key) { let obj ={ label: col.title, //表头名称 value: col.key //表取值字段key } fields.push(obj) } }) let fileName = '表格数据导出_' + new Date().toLocaleString('zh-CN') let json2csvParser = newParser({fields}) let result =json2csvParser.parse(listdata) let blob = new Blob(['ufeff' + result], {type: 'text/csv'}) let a = document.createElement('a') a.setAttribute('href', URL.createObjectURL(blob)) a.setAttribute('download', `${fileName}.csv`) a.click() },