页面元素转为图片

this.getToImg(this.pdfDomId).then((res) => {
    console.log(res)
    let imgId='img'+this.tinymceId
    let imgDom = document.getElementById(imgId)
    if(imgDom){
      imgDom.src = res
    }else{
      const img = document.createElement('img')
      img.width = 1000
      img.src = res
      img.id = imgId
      //将图片插入页面上指定元素中
      document.getElementById('tinymce').appendChild(img)
    }
});

import html2Canvas from 'html2canvas'

export default {
  install(Vue) {
    Vue.prototype.getToImg = function (pdfTitle) {
      let dom = document.querySelector('#'+pdfTitle);
      return html2Canvas(dom, {
        allowTaint: true
      }).then(function (canvas) {
          return canvas.toDataURL('image/jpeg', 1.0)
        }
      )
    }
  }
}

项目里，这个地方的需求是点击按钮，把“隐藏”起来的元素转为图片显示出来。隐藏元素一开始用的style="margin-top: -999999999px"这种方法，这样做在火狐浏览器上会有问题，后面改为style="position: fixed;left: 300%;bottom:-100%;width:100%"得以解决