<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 小时前
eCharts 多系列柱状图增加背景图追风筝的人er4 小时前
SpringBoot+Vue3 企业考勤如何处理法定假期?节假日方案、调休补班与工作日判断链路拆解Eiceblue7 小时前
使用 C# 将 Excel 转换为 Markdown 表格(含批量转换示例)Java面试题总结7 小时前
使用 Python 设置 Excel 数据验证编程老船长7 小时前
解决不同项目需要不同 Node.js 版本的问题薛定猫AI8 小时前
【深度解析】Gemma Chat 本地 AI 编程 Agent:Electron + MLX + 开源模型的离线 Vibe Coding 实战全栈前端老曹8 小时前
【前端地图】多地图平台适配方案——高德、百度、腾讯、Google Maps SDK 差异对比、封装统一地图接口笑虾9 小时前
Win10 修改注册表 让鼠标悬停PNG上时 tip 始终显示分辨率xiaogg36789 小时前
spring oauth2 单点登录雾岛听风6919 小时前
JavaScript基础语法速查手册