html2canvas截图 下载图片

// 引入htmlcanvas
import Vue from 'vue';
import html2canvas from 'html2canvas';
 
Vue.prototype.$html2canvas = html2canvas;

// 点击保存调用方法
handleSavePic(e) {
    this.bottomDialog = e
    const width = this.$refs['save-img'].clientWidth
    const height = this.$refs['save-img'].scrollHeight
    const self = this

      // 截图不全 备用滚动到顶部方案
      // window.pageYoffset = 0;
      // document.documentElement.scrollTop = 0;
      // document.body.scrollTop = 0;

    this.$html2canvas(this.$refs['save-img'], {
      backgroundColor: 'red',
      useCORS: true, 
       
      // 隐藏某个不像被截图的元素
      ignoreElements:(element)=>{
        if(element.id ==='pirntHideButton')
        return true;
      },

      scale: 2,
      width,
      height,
      windowHeight: height,
      scrollX: 0,

      //移动端截图截不全的解决办法(不兼容ios)
      // scrollY: -window.scrollY
      scrollY: -document.documentElement.scrollTop
    }).then(canvas => {
      self.imgUrl = canvas.toDataURL();
      // console.log(self.imgUrl)
      self.downloadFile('download.png', self.imgUrl);
    });
  },
    
    // 下载图片
    downloadFile(fileName, content) {
　　　　 // 浏览器
        const aLink = document.createElement('a');
        const blob = this.base64ToBlob(content);
        const evt = document.createEvent("HTMLEvents");
        evt.initEvent("click", true, true);
        aLink.download = fileName;
        aLink.href = URL.createObjectURL(blob);
        aLink.dispatchEvent(new MouseEvent('click', { bubbles: true, cancelable: true, view: window }));
      
    },
    base64ToBlob(code) {
      const parts = code.split(';base64,');
      const contentType = parts[0].split(':')[1];
      const raw = window.atob(parts[1]);
      const rawLength = raw.length;
      const uInt8Array = new Uint8Array(rawLength);
      for (let i = 0; i < rawLength; ++i) {
        uInt8Array[i] = raw.charCodeAt(i);
      }
      return new Blob([uInt8Array], { type: contentType });
    },