html2canvas 结合vue截图html生成图片

// 安装html2canvas

npm install html2canvas --save

// 引入 html2canvas

 import html2canvas from "html2canvas"

// html

   <div ref="imageWrapper" class="iswap"  id="imageWrapper">
      		<div class="isimg">
      <!--如果有图片，建议添加 crossOrigin='anonymous'，因为 canvas toDataUrl时可能会存在跨域问题 -->   
                            <img crossOrigin='anonymous' src="@/assets/application/twocode.png"/>
                         <!-- 这里可以放置你的任何HTML代码-->      
                        </div>
   </div>

// css

	#imageWrapper{
		  width: 340px;
      	  height: 480px;
       	   overflow: visible !important;
	}

// js

 html2canvas(this.$refs.imageWrapper, {
    useCORS: true    // 解决跨域问题
  }).then(canvas => {
    let dataURL = canvas.toDataURL("image/png");
  });

简单的截图就完成了，由于html2canvas 有些偏差，会存在白边。
注意：html2canvas截取的是可试窗口的数据