VUE使用QRcode或者vue-qr生成二维码

这里介绍两种vue生成二维码的方法

1. QRcode
2. vue-qr

vue-qr比QRcode功能多在可以在中间加logo

下面先介绍QRcode

vue里安装qrcodejs的npm包

npm install qrcodejs2 

import QRCode from 'qrcodejs2'

methods: {
creatQrCode() {
  var qrcode = new QRCode(this.$refs.qrCodeUrl, {
      text: 'xxxx',
      width: 100,
      height: 100,
      colorDark: '#000000',
      colorLight: '#ffffff',
      correctLevel: QRCode.CorrectLevel.H
 })
},
}

mounted() {
       this.creatQrCode();
    },

接下来介绍可以带logo的二维码vue-qr

npm安装

npm install vue-qr --save

是不是比qrcode简单的多， 只不过两种生成二维码的样式还是有区别的，各有所爱吧，用哪个都可以

要注意一点，引用的img路径一定要加require