使用html2canvas截取固定区域的图

1.安装

npm i html2canvas

2.引入

import html2canvas from "html2canvas"

3.使用

===>html

 

这是想要截图的内容 这是想要截图的内容

 

这是想要截图的内容 这是想要截图的内容

 保存

js====>

methods: {

html2canvas(document.querySelector("#imgPannel"), {

      allowTaint: true,//是否允许跨域图像

      useCORS: true,//是否尝试使用CORS从服务器加载图像

      scale: 1.5,//用于渲染的比例

      backgroundColor: null,//画布背景色（如果未在DOM中指定),置null为透明  })

.then((canvas) => {

const base64 = canvas.toDataURL("image/png", 1).slice(22);//已拿到图片的base64,可以自己进行后续处理 }) 

.catch((e) => {

console.log("html2canvas error:", e.message, e);})

}