html2canvas 保存图片

使用html2canvas库可以将网页元素转换成canvas对象，然后使用canvas.toDataURL()方法将canvas对象转换成base64编码的图片数据，最后可以将图片数据保存到本地。下面是一个简单的示例代码：

// 导入html2canvas库
import html2canvas from 'html2canvas';

// 获取需要保存为图片的元素
const element = document.getElementById('save-element');

// 使用html2canvas将元素转换成canvas对象
html2canvas(element).then(canvas => {
  // 将canvas对象转换成base64编码的图片数据
  const imageData = canvas.toDataURL('image/png');

  // 创建一个a标签用于下载图片
  const link = document.createElement('a');
  link.href = imageData;
  link.download = 'image.png';

  // 触发a标签的点击事件下载图片
  document.body.appendChild(link);
  link.click();
  document.body.removeChild(link);
});

在上面的示例代码中，我们使用了html2canvas将一个元素转换成canvas对象，并将canvas对象转换成base64编码的图片数据。然后，我们创建了一个a标签用于下载图片，将图片数据赋值给a标签的href属性，并设置下载的文件名。最后，我们触发了a标签的点击事件，以便用户可以下载图片。