1.安装2个依赖包
-
npm install -S file-saver xlsx
-
npm install -D script-loader
2. 在目录保存2个js 文件, 如目录:
js 文件的路径:
3. 在页面的应用
3.1 页面引用js 文件
3.2 在导出按钮调用方法
<a-button @click="exportExcel" v-if="$auth('users.add')" :loading="exportLoadding" >导出</a-button>
exportLoadding 方法
注意: this.exportData 是具体导出的数据结构, 里面数据是什么格式导出内容就是什么格式。
代码:
exportExcel() {
this.exportLoadding = true
require.ensure([], () => {
const tHeader = columns.map(v => v.title)
// 上面设置Excel的表格第一行的标题
const filterVal = columns.map(v => v.dataIndex)
// 上面的index、nickName、name是tableData里对象的属性
const list = this.exportData // 把data里的tableData存到list
const data = this.formatJson(filterVal, list)
exportJsonToExcel(tHeader, data, '用户列表')
})
this.exportLoadding = false
},
formatJson(filterVal, jsonData) {
const jsData = jsonData.map(v => filterVal.map(j => v[j]))
return jsData
}
js 文件下载地址:
Blob 和 Export2Excel 文件下载地址
https://download.csdn.net/download/qing12313359/16715802