konvaJs下载图片

konvaJs下载图片

不封装写法

  opacity.on("click", () => {
    const dataUrl = stage.toDataURL();
      
    const link = document.createElement("a");
    link.download = "下载.png";
    link.href = dataUrl;
      
    document.body.appendChild(link);
    link.click();
      
    document.body.removeChild(link);
    delete link;
  });

封装

封装下载图片函数

/* 下砸图片 */
  function downloadImage(imageData, imageName) {
    const link = document.createElement("a");
    link.download = imageName;
    link.href = imageData;

    document.body.appendChild(link);
    link.click();
    document.body.removeChild(link);

    delete link;
  }

绑定点击事件

opacity.on("click", () => {
    const dataUrl = stage.toDataURL();
    downloadImage(dataUrl, "新的图片");
  });