<canvas 
  class='canvas' 
  canvas-id='canvas' 
  style="width:{{qrcodeWidth}}px; height:{{qrcodeWidth}}px;margin:{{marginTB}}rpx auto;"
></canvas>

{
  "component": true
}

const QRCode = require('../../utils/weapp-qrcode.js')
import rpx2px from '../../utils/rpx2px.js'
let qrcode;
let defaultWidth 
 
= 300; //二維碼預設寬度

Component({
    properties: {
        //二維碼碼數
        code: {
            type: String,
            value: '' 
        },
        //二維碼預設寬度
        width: {
            type: Number,
            value: defaultWidth 
        },
        //二維碼預設margin上下邊距
        marginTB: {
            type: Number,
            value: 
 
0
        }
    },
    data: {
        qrcodeWidth: rpx2px(defaultWidth), 
    },
    ready: function() {
        this.setData({qrcodeWidth: rpx2px(this.properties.width)})
        qrcode = new QRCode('canvas', {
            usingIn: this, // usingIn 如果放到元件裡使用需要加這個引數
            text: this.properties.code,
            image: 
 
'',
            width: rpx2px(this.properties.width),
            height: rpx2px(this.properties.width),
            colorDark: "#010101",
            colorLight: "white",
            correctLevel: QRCode.CorrectLevel.H,
        });
    },
    methods: {}
})

原始碼地址：https://github.com/tomfriwel/weapp-qrcode