JavaScript导出图片和数据到Excel

以下方法可以利用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、关于使用过程出现的一些问题

  1. 注入数据的图片目前支持http和https格式,暂时不支持base64等其他格式。
  2. 打开Excel过程中会出现警告,点击继续即可。
  3. 目前不支持多个sheet。

github: https://github.com/hxj9102/table2excel

 

如果大家在使用的过程中遇到问题,可以给本同学留言,我们来一起探讨。

这个导出方法为作者根据网络资料进行改进,如需转载,请联系博主。

  • 11
    点赞
  • 42
    收藏
    觉得还不错? 一键收藏
  • 54
    评论
### 回答1: 使用js-table2excel无法直接导出图片js-table2excel是一个用于将HTML表格导出Excel文件的JavaScript库,它主要是用于导出表格中的数据。而图片通常不是直接插入到表格中显示的,而是通过在表格中插入图片的URL或者使用img标签来显示。因此,js-table2excel无法直接导出表格中的图片。 如果想要将图片一起导出Excel文件中,可以使用其他的方法。一种常见的方法是使用其他JavaScript库,如js-xlsx或者SheetJS,这些库可以处理更复杂的Excel导出需求,包括导出带有图片的表格。这些库提供了更多功能和选项,允许通过编程方式将图片插入到Excel文件中。 另外,还可以考虑将图片保存为Base64编码的字符串,并将该字符串作为数据保存在表格中的某个单元格中。然后,使用js-table2excel将带有Base64编码图片字符串的表格导出Excel文件中。虽然这种方法不会直接导出图片,但可以在表格中保留图片的信息。 总之,由于js-table2excel库的特性限制,无法直接使用该库导出带有图片Excel文件。但是可以通过其他方法来实现这个目标,比如使用其他JavaScript库或者将图片保存为Base64编码的字符串。 ### 回答2: js-table2excel是一个用于将HTML表格导出Excel文件的JavaScript库,它并不支持直接将图片导出Excel文件中。这是因为Excel文件的格式与HTML的图片格式不同。 要在Excel文件中导出图片,可以使用其他方法,例如使用Excel插件或将图片嵌入到生成的Excel文件中。 一种常见的方法是使用Excel插件,例如js-xlsx或SheetJS。这些插件提供了更强大的功能,可以直接将图片插入到生成的Excel文件中,同时支持更复杂的Excel操作,如合并单元格、格式化等。 另一种方法是使用基于服务器端的技术来生成Excel文件,例如使用Node.js中的库或其他服务器端语言,然后在服务器端将图片嵌入到生成的Excel文件中。这种方法较复杂,需要有服务器端编程的知识和技巧。 总结起来,使用js-table2excel无法直接导出图片Excel文件中,但可以尝试使用其他工具或方法来实现此功能。具体方法可以根据实际需求和技术条件选择适合的方案。 ### 回答3: 使用js-table2excel插件无法直接导出图片js-table2excel插件是一个用于导出html表格数据Excel的插件,它主要用于导出数据表格,而不是导出图片。如果需要导出带有图片Excel文件,可以考虑使用其他方法。 一种可行的解决方案是使用其他插件或库来实现导出带有图片Excel文件。例如,可以使用js-xlsx库来生成Excel文件,并将图片插入到Excel表格中的相应单元格。具体步骤如下: 1. 首先,将图片转换为Base64编码。 2. 创建一个xlsx工作簿对象。 3. 创建一个工作表对象,并在适当的单元格中插入图片。可以使用`addImage`方法来实现。 4. 将工作表添加到工作簿中。 5. 将工作簿保存为Excel文件。 这样就可以导出带有图片Excel文件了。需要注意的是,这种方法可能比较复杂,需要一定的编程知识和经验。 总之,如果使用js-table2excel插件无法导出图片,可以考虑使用其他插件或库来实现导出带有图片Excel文件。
评论 54
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值