链接生成二维码( QRCode )

Vue中链接生成二维码

1. 安装插件

   sudo npm install qrcodejs2 --save
   

2. 页面中引入

    import QRCode from "qrcodejs2";
   

   components: { QRCode },
   

3. 页面展示与配置

   html部分

   <div class="QR-code">
    	<div id="qrCode" ref="qrCodeDiv" class="qrCode"></div>
   </div>
   

   方法

   createQrCode(){
   	let that = this;
   	document.getElementsByClassName('QR-code');
   	document.getElementById("qrCode").innerHTML = "";
   	new QRCode(that.$refs.qrCodeDiv, {
   		text:that.appletUrl, //获取到的链接
           width: 160,
           height: 160,
           colorDark: "#000000", //二维码颜色
           colorLight: "#ffffff", //二维码背景色
           correctLevel: QRCode.CorrectLevel.H //容错率，L/M/H
      })
   },