1.需要将要转换成图片的区域div放置在body中,且需要display为block;2.图片跨域的问题:将icon转换为base643.截图不全:新版本插件不稳定,建议<script src="https://cdn.bootcss.com/html2canvas/0.5.0-alpha1/html2canvas.min.js"></script>多尝试几个版本

1.需要将要转换成图片的区域div放置在body中,且需要display为block;

html2canvas 采坑(html2canvas源码解析)  html2canvas采坑 第1张

2.图片跨域的问题:将icon转换为base64

3.截图不全:新版本插件不稳定,建议

<script src="https://cdn.bootcss.com/html2canvas/0.5.0-alpha1/html2canvas.min.js"></script>多尝试几个版本document.querySelector("#slot").innerHTML = dom; document.querySelector("#share-module").style.display = "flex"; setTimeout(function(){ html2canvas(document.querySelector("#html2canvas"),{useCORS:true}).then(canvas => { document.querySelector("#shareImg").src=canvas.toDataURL(); document.querySelector("#slot").innerHTML = ""; }); },10);

此处的dom为要截图的区域div;

转载请说明出处
知优网 » html2canvas 采坑(html2canvas源码解析)

发表评论

您需要后才能发表评论