在vue项目中html2canvas实现网页为图片形式下载到本地

我的需求：

需求描述：将后台返回的链接 生成二维码 将二维码及以上的html 变成图片 ，保存在本地上。

下面我根据二维码生成图片用到了html2canvas渲染成canvas

1.项目中引用需安装 html2canvas

npm install --save html2canvas

 // 在需要使用的页面中先引入html2canvas
 import html2canvas from 'html2canvas'

以上就安装完成了html2canvas
2.需明白在html结构中生成图片的结构 需区分出来，然后再结构最外层 包一个大的div 两个都需要用到ref来获取dom,如下面代码：

<div ref="addImage">//用最大的div包起来
        <div class="redBlock" ref="capture">  //想要生成图片的结构
          <div class="box"></div>    //内容随便写
         </div>