<el-button
type="warning"
icon="el-icon-download"
size="small"
@click="onBatchExport"
>
导出
</el-button>
安装插件
npm install js-table2excel
导入插件
import table2excel from 'js-table2excel'
data(){
return {
listDatanew: []
}
}
// 导出事件 datas是接口返回的数据
onBatchExport() {
const column = [
{
title: '姓名',
key: 'name',
type: 'text'
},
{
title: '年龄',
key: 'age',
type: 'text'
},
{
title: '巡检时间',
key: 'XJDATE',
type: 'text'
},
{
title: '问题描述',
key: 'PROBLEM',
type: 'text'
},
{
title: '图片1',
key: 'IMG1',
type: 'image',
width: 50,
height: 50
},
{
title: '图片2',
key: 'IMG2',
type: 'image',
width: 50,
height: 50
},
]
let tableDatas = JSON.parse(JSON.stringify(this.listDatanew))
let datas = tableDatas;
table2excel(column, datas, '导出后的文件名')
},
vue table表格导出图片到Excel
ratel️2023-11-04 12:21
相关推荐
《独白》1 小时前
将图表和表格导出为PDF的功能什码情况1 小时前
微服务集成测试 -华为OD机试真题(A卷、JavaScript)你的人类朋友2 小时前
浅谈Object.prototype.hasOwnProperty.call(a, b)Mintopia2 小时前
深入理解 Three.js 中的 Mesh:构建 3D 世界的基石打瞌睡de喵2 小时前
JavaScript 空对象检测前端太佬2 小时前
暂时性死区(Temporal Dead Zone, TDZ)Mintopia2 小时前
Node.js 中 http.createServer API 详解艾克马斯奎普特2 小时前
Vue.js 3 渐进式实现之响应式系统——第三节:建立副作用函数与被操作字段之间的联系青青奇犽2 小时前
Vue 组件通信全解析:七种核心方式与最佳实践忆柒2 小时前
理解 JavaScript 原型和继承:从原型链到类的演变