美文网首页
vue生成二维码

vue生成二维码

作者: 一半春夏一半秋冬 | 来源:发表于2019-03-15 11:07 被阅读0次

1、下载依赖的文件

    npm install qrcodejs2 --S

2、引入文件

     import QRCode from 'qrcodejs2';

3、设置盛放二维码的容器

<article class="qrcode" ref="fixed_qrcode"></article>

4、初始化二维码参数

mounted(){
    let than=this;
    than.$nextTick(function(){
        than.qrCoupon=new QRCode(than.$refs.fixed_qrcode,{
            text:' ',
            width:256, // 图像宽
            height:256, // 高
            typeNumber:4,
            colorDark:'#000', // 前景色
            colorLight:'#fff', //背景色
            correctLevel:QRCode.CorrectLevel.L //容错级别(L/M/Q/H)
        });
    });
  }

5、设置二维码内容

methods(){
   showQrCoupon(){            
 this.qrCoupon.makeCode('www.baidu.com'); 
    },
}

相关文章

网友评论

      本文标题:vue生成二维码

      本文链接:https://www.haomeiwen.com/subject/qcfmlqtx.html