html2canvas实现dom转成图片变下载

import html2canvas from "./html2canvas.min.js";

new html2canvas(document.getElementById('cur-cert-img'),
      {
          allowTaint: true,
          useCORS: true,  // 跨域
          scale: 2, // 文字清晰
          dpi: 300,  // 文字清晰
          width: 400,
          height: 300
        }
      ).then(canvas => {
       // canvas为转换后的Canvas对象
        let oImg = new Image();
        oImg.src = canvas.toDataURL();  // 导出图片
        document.body.appendChild(oImg);  // 将生成的图片添加到body
        oImg.onload = () => {
         const a = document.createElement("a");
          a.href = oImg.src;
          a.download = certObj.title;
          a.click();
        }
       document.body.removeChild(oImg)
     });

  1. 如果下载下来的图片, 原dom结构里的图片部分不清晰,应使用img表情,不能使用style背景图
posted @ 2022-10-17 15:33  yangAL  阅读(34)  评论(0编辑  收藏  举报