由于项目需要页面截图功能,我就找到了html2canvas插件
<div ref="shareDom">
<div class="exclude"></div>
</div>
<button @click="goShare()">分享</button>
// js
async goShare(){
let dom = this.$refs["shareDom"];
const res = await html2canvas(dom, {
width: parseInt(window.getComputedStyle(dom).width),
height: parseInt(window.getComputedStyle(dom).height),
allowTaint: true,
taintTest: false,
scale: window.devicePixelRatio, // 设备像素比
ignoreElements:(element)=>{ // 可从渲染中删除匹配的元素
if(element.className === 'exclude') return true;
},
})
this.imgUrl = res.toDataURL()
}
最后就是一张base64图片,大功告成。