<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
相关推荐
小光学长10 分钟前
基于Vue的2025年哈尔滨亚冬会志愿者管理系统5zqg6m36(程序+源码+数据库+调试部署+开发环境)带论文文档1万字以上,文末可获取,系统界面在最后面。@PHARAOH20 分钟前
WHAT - 受控组件和非受控组件麦麦大数据1 小时前
D027 v2 vue+django+neo4j 基于知识图谱红楼梦问答系统 (新增问关系功能;新增知识节点和关系管理功能,neo4j增删改查功能)专注前端30年2 小时前
【JavaScript】reduce 方法的详解与实战菜鸟una3 小时前
【瀑布流大全】分析原理及实现方式(微信小程序和网页都适用)专注前端30年3 小时前
2025 最新 Vue2/Vue3 高频面试题(10月最新版)Highcharts.js3 小时前
选择合适的组合:如何打造数据可视化的“黄金组合”angelQ4 小时前
Vue 3 中 ref 获取 scrollHeight 属性为 undefined 问题定位我的div丢了肿么办5 小时前
js函数声明和函数表达式的理解AAA阿giao5 小时前
JavaScript 对象字面量与代理模式:用“胡巴送花”讲透面向对象与设计思想