html2canvas用法即踩坑记录（小程序uniapp框架）

绚丽烟火487

已于 2022-09-22 17:17:33 修改

阅读量4.6k

点赞数 4

文章标签：小程序 uni-app 前端 vue html

于 2022-09-22 17:15:45 首次发布

本文链接：https://blog.csdn.net/weixin_55582221/article/details/126992659

版权

本文记录了在uni-app小程序中利用html2canvas将HTML表格转换为图片的过程，包括解决隐藏不需要显示元素的方法，即在相应view标签添加data-html2canvas-ignore属性。

摘要由CSDN通过智能技术生成

在写项目的时候遇到了一个问题，就是需要把生成出来的表格生成图片，可以让用户直接保存下来。之前倒是使用过canvas生成图片，但是需要完全手写，而且样式也没有很多种。

如何使用JS截取HTML页面为图片呢，下面为大家介绍一款JS截图插件html2canvas

html2canvas能够实现在用户浏览器端直接对整个或部分页面进行截屏。

html2canvas可以将当页面渲染成一个Canvas图片，通过读取DOM并将不同的样式应用到这些元素上实现。

在官网上粘贴过来的，因为官网是英文，我是按照我自己的理解去写的描述。如果有误差，欢迎大家指正。

属性	默认值	描述
allowTaint	false	是否允许跨原点图像污染画布
backgroundColor	#ffffff	画布背景颜色，如果没有在DOM中指定。为透明设置null
canvas	null	现有的画布元素用作绘图的基础
foreignObjectRendering	false