vue used qrcode dynamically generated two-dimensional code and click the button several times to solve the problem of generating two-dimensional code

There are many online tutorials, installation npm, but I did not succeed, so I use the introduction js file

The qrcode.js introducing your page

I js files and pages in a folder, because there is not only qrcode into the window below, under the changed content with qrcode.js es mode, var QRCodechanged window.QRCode;then introduced js in downLoad.vue in import "./qrcode";
note It is possible because of the different configuration of vue, introducing a different way ;

Add function methods in

showQRCodeDialog(type) {
      let qrcodeEL = document.getElementById("qrcode");
      let qrcode = new QRCode(qrcodeEL);  
        document.getElementById("qrcode").innerHTML = "";
        this.showQRCode = true;
        this.getCode(type)
    },
    getCode(type) {
      let text="";
      // 设置参数方式
      if(type === 1){
        text = "http://www.baidu.com";
      }else{
        text = "https://www.csdn.net/"
      }
      var qrcode = new QRCode("qrcode", {
        text: text,
        width: 256,
        height: 256,
        colorDark: "#000000",
        colorLight: "#ffffff",
        correctLevel: QRCode.CorrectLevel.H
      });
    }

Be sure to add document.getElementById("qrcode").innerHTML = "";, otherwise every click of a button will be more of a two-dimensional code