vue中使用html2canvas将HTML内容写入Canvas生成图片
本周有个需求是将HTML渲染好的页面生成图片，用户在微信端使用的时候能够保存到相册。于是一顿搜索猛如虎之后，发现html2canvas这个插件能够解决。因为项目中用到的框架是vue，这里就讨论一下在vue中如何使用html2canvas。
1.安装html2canvas
【vue中使用html2canvas将HTML内容写入Canvas生成图片】Install NPM
npm install --save html2canvas
Install Yarn
yarn add html2canvas
我在这里使用的是1.0.0版本2.html2canvas生成截图
文章图片
这里有个坑就是在页面没有完全渲染完毕的情况下，在移动端上下拉动页面会出现页面元素位置不准确或者图片生成不完整的情况，因此加上判断条件，让页面渲染完毕之后使html2canvas绘制好的图片显示出来可以避坑。
推荐阅读
- 热闹中的孤独
- Shell-Bash变量与运算符
- JS中的各种宽高度定义及其应用
- 2021-02-17|2021-02-17 小儿按摩膻中穴-舒缓咳嗽
- 深入理解Go之generate
- 由浅入深理解AOP
- 异地恋中，逐渐适应一个人到底意味着什么（）
- vue-cli|vue-cli 3.x vue.config.js 配置
- 【译】20个更有效地使用谷歌搜索的技巧
- 我眼中的佛系经纪人