vue-element-admin使用qrcode生成二维码

qrcode的npm地址
使用mixin独立封装qrcode.js

/**
 * 
 * @description 生成二维码
 * **/ 

 var QRCode = require('qrcode')


 export const qrcode = {
   
     methods:{

        getQRCode() {
            let opts = {
                errorCorrectionLevel: "H",//容错级别
                type: "image/png",//生成的二维码类型
                quality: 0.3,//二维码质量
                margin: 1,//二维码留白边距
                width: 260,//宽
                height: 260,//高
                text: '',//二维码内容
                color: {
                    dark: "#39b288",//前景色,二维码的颜色
                    light: "#fff"//背景色
                }
            };
            let QRCodeMsg = this.codeText; //生成的二维码为URL地址js
            let QrElement = document.getElementById("the-canvas");
            // 将获取到的数据（val）画到msg（canvas）上
            
            QRCode.toCanvas(QrElement, QRCodeMsg, opts,  (err, canvas) => {
                console.log(err)
            });

        }

     }
 }

注意：被渲染的标签，必须是canvas；
比如：

<canvas id="the-canvas" ></canvas>

而不是其他标签