在vue中使用html2canvas，qrcanvas生成带二维码的截图功能

• Z时代
• 2024-01-10
• 分类：综合

1，先安装插件依赖并且引入

npm i -D html2canvas

npm install --save qrcode

2，定义盒子，先隐藏二维码和图片

3，引入插件，定义变量控制隐藏

4，在mounted中，先生成出二维码，不做显示，用css先设置好二维码显示的位置

5.接下来就是点击截图触发事件了，其中的一些html2canvas 的参数可以自己调试，图片生成后，在成功回调中将图片信息给上面的预先埋好的盒子，并且置顶到最前面，类似遮罩层的意思，到这里基本就完成了。。。。

以上是 在vue中使用html2canvas，qrcanvas生成带二维码的截图功能 的全部内容， 来源链接： utcz.com/z/377611.html