Vue项目里使用QRCode

1.项目中引入qrcodejs2

npm install qrcodejs2 --save

2.要生成二维码的页面引入qrcodejs2

import QRCode from 'qrcodejs2';

3.添加方法

 methods: {
     createCode() {
      let item = new QRCode(this.$refs['qr'], {
        text: this.code,
        width: 98,
        height: 98,
        correctLevel: QRCode.CorrectLevel.H
      });
      this.$nextTick(() => {
        this.path = item._oDrawing._elCanvas.toDataURL('image/png');
      });
    }  
}

4.需要调用的时候调用

this.createCode();

5.一些初始化的 

data() {
    return {
      path: '',
      deliveryFormNo: ''
    }
}

computed: {
    return `${this.deliveryFormNo}`;
}
// res.code === 200 =>之后
this.deliveryFormNo = data.deliveryFormNo;
// 我是在这里调用createCode()的

6.页面

<div class="img">
   <div ref="qr" class="qr" style="display: none"></div>
   <img :src="path" />
</div>