使用QRCode生成二维码

1、引入

import QRCode from '@/frame/plugins/qrcode.js'

// 也可以用 npm i qrcodejs2安装后 import QRCode from 'qrcodejs2'引入

2、HTML

<div id="pic" />

 3、js

methods: {
  getQrcode (text) {
    // eslint-disable-next-line no-undef
    var qrcode = new QRCode(document.getElementById('pic'), {
      width: 180, // 设置宽高
      height: 180
    })
    qrcode.makeCode(text)
  },
  // 调用，传数据
  this.getQrcode(res || '')

 4、效果图

5、QRCode其他配置项 

var qrcode = new QRCode('qrcode', {
  text: 'www.baidu.com', // 二维码地址
  width: 180, // 二维码宽度
  height: 180, // 二维码高度
  colorDark : '', // 二维码前景色设置
  colorLight : '', // 二维码背景色设置
  correctLevel : QRCode.CorrectLevel.L // 容错级别，可配置L M Q H 
})

// 使用 API
qrcode.clear(); // 清除二维码
qrcode.makeCode(text); // 二维码内容

二维码容错率，是指二维码图标被遮挡多少后，仍可被扫描出来的能力