html2canvas

图片定位上去，img标签加crossorigin="anonymous"属性 未验证是否有效

<div class="posterBox" id="myImage">
  <div class="img1" >
    <img crossorigin="anonymous" :src="posterUrl">
  </div>
  <div class="qrCodeBox">
    <img crossorigin="anonymous"  :src="qrCodeUrl" />
  </div>
</div>
<el-button @click="savePoster">下载海报</el-button>
<a id="posterClick"></a>

html2Canvas第二个参数一定要写，会有网络图片跨域下载的图不准确的问题

savePoster() {
  html2canvas(document.querySelector('#myImage'), {
    useCORS: true, // 这个为true代表允许跨域
    allowTaint: false,
    logging: false,
    letterRendering: true
  }).then((canvas) => {
    const linkBox = document.getElementById('posterClick')
    linkBox.setAttribute('download', '组合图.png')
    linkBox.setAttribute('href', canvas.toDataURL('image/png').replace('image/png', 'image/octet-stream'))
    linkBox.click()
  })
}