Vue.js结合Canvas制作二维码和图片的合成（qrcanvas + html2canvas）

(这个有问题，最近会把整理后的更新上去！！！！！！)

最新最新！！！：https://blog.csdn.net/zuorishu/article/details/88632978

需求背景：

 分享图片，图片中含有自己分享链接生成的二维码！！

大体思路：

• 第一步、根据自己的分享链接生成一张二维码；
• 第二步、结合一张图片合成带分享二维码的大图；

开干：

首先来生成二维码，之前都是使用jQuery.qrcode这个插件进行二维码生成，使用vuejs后不想依赖jQuery，就重新找了一个

qrcanvas，使用方法上篇博客有提到，这里结合图片再来引用一下。

1.npm安装：npm install qrcanvas

2.页面引入：import { qrcanvas } from 'qrcanvas';

3.html：写一个带id(id自定义)的div

<template>
    <div class="container">
        <div class="box" ref="box">
            <div id="qrcode"></div>
        </div>
    </div>
</template>

4.js很简单

    created() {
        let that = this;
        that.$nextTick(function () {
           var canvas1 = qrcanva