vue 链接生成二维码(QRCode)

1、安装 qrcodejs2

        cnpm i qrcodejs2 --save

2、页面中引入

        import QRCode from "qrcodejs2";

3、页面展示

        <div id="qrcode" ref="qrcode"></div>

4、QRCode配置（methods）

        qrcode () {
                let qrcode = new QRCode("qrcode", {

                          width: 200, // 二维码宽度，单位像素

                          height: 200, // 二维码高度，单位像素

                          text: "https://www.baidu.com/" // 生成二维码的链接

                });

        }

5、调用

        this.$nextTick(() => {

                this.qrcode();

         });

多个链接生成二维码（ 直接代码 ）

html

        <div v-for="(item,index) in this.qrCodeList" :key="index" class="qrcode-box" :id='"qrcode" + index' ref="qrcode">

js

        this.$nextTick(() => {

                this.qrcode(this.qrCodeList)

         })

        qrcode(qrCodeList) {

              qrCodeList.forEach((item,index) => {

                    let qrcode = new QRCode("qrcode"+index, {

                          width: 200, // 二维码宽度，单位像素

                          height: 200, // 二维码高度，单位像素

                          text: item // 设置二维码内容或跳转地址

                    });

              });

        },