[JavaScript知识库]html2canvas使用中遇到的问题

使用html2canvas可以对指定原生元素进行截图，本来是要用echarts直接截图的，但echarts自身的API有些情况下不能满足需求，所以前者用起来自由度好一些

ie兼容

ie运行截图后提示打开blob程序弹窗

html2canvas在ie环境使用会出现缺少blob的问题，对其进行兼容性操作

exportDivImgs (ref, name) {
      html2canvas(this.$refs[ref], {
        scrollY: 0,//滚动条置顶
        width: this.$refs[ref].clientWidth + 10,//设置截图的偏移
        height: this.$refs[ref].clientHeight + 20
      }).then(canvas => {
        const dataURL = canvas.toDataURL('image/png')//base64码
        const userAgent = navigator.userAgent//获取浏览器类型
        // 兼容ie
        if (userAgent.includes('Trident')) {//判断IE内核
          const arr = dataURL.split(',')
          const mime = arr[0].match(/:(.*?);/)[1]
          const bstr = atob(arr[1])//
          let n = bstr.length
          const u8arr = new Uint8Array(n)
          while (n--) {
            u8arr[n] = bstr.charCodeAt(n)
          }
          window.navigator.msSaveBlob(new Blob([u8arr], { type: mime }), `${name}.jpg`)
        } else {
          const linkDom = document.createElement('a')
          linkDom.className = 'part-download'
          document.body.appendChild(linkDom)
          linkDom.href = dataURL
          linkDom.download = name // 命名下载名称
          linkDom.click() // 触发下载
          window.URL.revokeObjectURL(dataURL) // 下载完成进行释放
          document.body.removeChild(linkDom) // 删除新增节点
        }
      })
    }

ie中使用，不支持elementUI的复选框，会样式错乱和缺失

尝试换成旧版本的html2canvas@v0.5.0-beta4，结果谷歌浏览器里复选框截图后勾也没了。
暂时没找到有效合理的方法

elementUI中的元素绑定id和ref报错

直接给比如绑定id、ref会报错，Error: Element is not attached to a Document。
可以用div然后让class=“el-row”，绘图要选择的dom元素必须是原生元素，不能使用ui库元素；