Vue中使用html2canvas将HTML转为图片下载并保存

本文转载自查看原文 2021-01-11 16:59 447 Vue

 1 首先引入：import html2canvas from '../../static/js/html2canvas.min.js'
 2 
 3 然后：
 4 <div id="capture" style="padding: 10px; background: #f5da55">
 5     <h4 style="color: #000; ">Hello world!</h4>
 6 </div>
 7 最后：
 8 html2canvas(document.querySelector('#map')).then(canvas => {
 9         let dataURL = canvas.toDataURL('image/png')
10         if (dataURL !== '') {
11           let alink = document.createElement('a')
12           alink.href = dataURL
13           alink.download = 'downloadImage.png'
14           alink.click()
15         }
16       })

官方网站：http://html2canvas.hertzen.com/

免责声明！

本站转载的文章为个人学习借鉴使用，本站对版权不负任何法律责任。如果侵犯了您的隐私权益，请联系本站邮箱yoyou2525@163.com删除。

猜您在找 使用 html2canvas 将页面中某一部分转为图片下载使用html2canvas js 截取网页图片下载 vue中使用html2canvas截取div内容转为图片 js使用html2canvas实现页面截图并保存图片 Vue使用html2canvas将页面转化为图片 html2canvas的使用：vue中将div导出成图片 html2canvas 生成base64图片 vue使用前端使用html2canvas截图，在canvas上绘制图片及保存图片 Vue移动端h5使用canvas将页面生成海报保存分享（html2canvas）利用html2canvas将当前网页保存为图片.