// WXML
<view class="qrcode">
<canvas class="code" :style="{ width: qrcode_width + 'px', height: qrcode_width + 'px' }" canvas-id='qrcodeNode'></canvas>
</view>
// JS
import QRCode from '../../utils/qrcode.min.js';(白嫖往这儿看: https://github.com/suncunxu/Notes )
// 生成二维码
getQrcode: function (phone) {
const W = wx.getSystemInfoSync().windowWidth;
const rate = 750.0 / W;
const qrcode_width = 120 / rate;
// 生成二维码
new QRCode({
// usingIn: this, // usingIn 如果放到组件里使用需要加这个参数
text: "https://www.xxx.com/qrCode/integral?action=gogogo&phone=" + phone,//需要转换成二维码的数据
canvasId: 'qrcodeNode',//一定要和页面中<canvas>中得data-id名称一致
colorDark: "#DA4967",
colorLight: "white",
correctLevel: 1,
width: qrcode_width ,
height: qrcode_width ,
});
}
// WXSS
.qrcode {
padding: 10rpx 10rpx;
background-color: #fff;
box-sizing: border-box;
}
.code{
width: 120rpx;
height: 120rpx;
}