HTML2Canvas使用總結

1：指定要生成的DOM元素id

2： 某些圖片動態賦值src的url或者base64可能不會被立即渲染；可以設置一個定時器解決

3：可以調用次方法得到的canvas元素轉一下格式 png/jpg

4： uniapp中使用時scale設定4倍移動端不模糊

5: 線上圖片需要后端設置允許跨域訪問

var copyDom = document.querySelector('#sxh');
      const width = copyDom.offsetWidth;
      const height = copyDom.offsetHeight;
      let scale = 4; // 設定倍數這樣不會模糊
      html2canvas(copyDom, {
        width:width,
        heigth:height,
        windowHeight:height,
        windowWidth:width,
        scale:scale,
        scrollX:0,
        scrollY:0,
        y:0,
        useCORS: true,
        // allowTaint: true,
        // backgroundColor:"#2ab77d",
      }).then((canvas) => {
        var url = canvas.toDataURL("image/png", 1.0).replace("image/png","image/octet-stream");//圖片地址