vue-element-admin后台导出带图片的excel
vue-element-admin
PanJiaChen/vue-element-admin: 是一个基于 Vue.js 和 Element UI 的后台管理系统模板,支持多种数据源和插件扩展。该项目提供了一个完整的后台管理系统模板,可以方便地实现后台管理系统的快速搭建和定制,同时支持多种数据源和插件扩展。
项目地址:https://gitcode.com/gh_mirrors/vu/vue-element-admin
免费下载资源
·
1.引入js-table2excel插件
import table2excel from 'js-table2excel'
2.导出的表头数据
data() {
excelHeaderArr: [
{
title: '第一个字段',
key: 'column_1',
type: 'text'
},
{
title: '第二个字段',
key: 'column_2',
type: 'text'
},
{
title: '第三个字段',
key: 'column_3',
type: 'text'
},
{
title: '图片字段',
key: 'imgurl',
type: 'image',
width: 100,
height: 100
}
]
}
3.导出的方法
async batchDown() {
var that = this
var finalData = []
// 调用接口获取数据
await getList().then(response => {
// 这里处理特殊字段
var filterList = response.filter(function(item) {
// 例如处理null值
item.imgurl = item.imgurl ? item.imgurl : ''
// return false时代表移除对应的item
return true
})
finalData = finalData.concat(filterList)
})
// 执行导出
table2excel(that.excelHeaderArr, finalData, 'excel列表.xlsx')
},
GitHub 加速计划 / vu / vue-element-admin
87.26 K
30.42 K
下载
PanJiaChen/vue-element-admin: 是一个基于 Vue.js 和 Element UI 的后台管理系统模板,支持多种数据源和插件扩展。该项目提供了一个完整的后台管理系统模板,可以方便地实现后台管理系统的快速搭建和定制,同时支持多种数据源和插件扩展。
最近提交(Master分支:2 个月前 )
0caa975e - 2 年前
cd3f7267 - 2 年前
更多推荐
已为社区贡献3条内容
所有评论(0)