vue 文本转换成图片格式组件html2canvas踩坑之旅

web端的报表导出格式一般都是后台直接导出的excell，但新需求要求能够导出图片形式，调研之后发现html2canvas能够实现，使用过程中有几个需要注意的地方

1. 包裹元素的跟元素XXXX必须是dom的原生对象，不能是组件库中的元素作为跟元素

html2canvas(this.$refs.XXXX).then(canvas => {
  let dataURL = canvas.toDataURL('image/png')
  let link = document.createElement('a')
  link.href = dataURL// 下载链接
  link.setAttribute('download', 'XXXX.png')
  link.style.display = 'none'// a标签隐藏
  document.body.appendChild(link)
  link.click()
})
2. 还有若有图片的或者背景图片的情况下需要先将背景图片设置为前景图，
具体参考： https://blog.csdn.net/jinxi1112/article/details/101285998?spm=1001.2014.3001.5501