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

 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/

 

posted @ 2021-01-11 16:59  yw3692582  阅读(813)  评论(0编辑  收藏  举报