<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
相关推荐
宿6746 小时前
vue3-包管理器mayaairi7 小时前
Vue2 生命周期完全指南:从创建到销毁的8个钩子函数研☆香7 小时前
一个简单的气泡弹窗制作大模型丫丫7 小时前
用 TypeScript、NestJS 和 LangGraph 搭建一个可控的 AI AgentIMPYLH8 小时前
HTML 的 <pre> 元素shmily麻瓜小菜鸡8 小时前
JavaScript / TypeScript 易踩坑知识点 —— 异步编程类tsumikistep9 小时前
【前端】Vue + Axios 跨域问题实战:7070 代理转发 8080 + 401 报错分析(黑马外卖)今日无bug10 小时前
从0到1手撕流式输出:Vue3 + Vite 实现 LLM 流式响应全解析默_笙11 小时前
🧀 用户访问一个网站到底经历了什么?全栈部署的"城市观光"指南晓天衡宇•评测社区12 小时前
Seedance 2.5 登顶图生视频榜单,Wan 3.0 在游戏与教育场景进入前列