以下方法可以利用json数据将图片地址生成图片导出到Excel,同样也可以将数据导出到Excel。解决网上许多方法关于导出图片到Excel却无法让图片在单元格内显示的问题,也解决了各类浏览器兼容问题。话不多少,先上车吧(哈哈)
1、安装依赖
npm install js-table2excel
2、在页面中引入,并注入数据。栗子
const column = [
{
title: 'Name',
key: 'name',
type: 'text'
},
{
title: 'Pic',
key: 'pic',
type: 'image',
width: 80,
height: 50
}
]
/** column数据的说明 */
// 1.title为列名
// 2.key为data数据每个对象对应的key
// 3.若为图片格式, 需要加type为image的说明,并且可以设置图片的宽高
const data = [
{
name: 'xiao',
age: '18',
pic: 'https://profile.csdnimg.cn/9/8/3/2_xiaoxiaojie12321'
},
{
name: 'jie',
age: '18',
pic: 'https://profile.csdnimg.cn/9/8/3/2_xiaoxiaojie12321'
}
]
const excelName = 'boy'
table2excel(column, data, excelName)
3、生成的Excel表格
4、关于使用过程出现的一些问题
- 注入数据的图片目前支持http和https格式,暂时不支持base64等其他格式。
- 打开Excel过程中会出现警告,点击继续即可。
- 目前不支持多个sheet。
github: https://github.com/hxj9102/table2excel
如果大家在使用的过程中遇到问题,可以给本同学留言,我们来一起探讨。
这个导出方法为作者根据网络资料进行改进,如需转载,请联系博主。