话不多说,直接上代码。
这里的宽高是二维码的宽高
<view id="container" class="qrcode"> <view class="ewm"> <canvas style="width: 400rpx; height: 400rpx;" canvas-id="myQrcode"> </canvas> </view> </view>
.ewm的宽高是背景的宽高,如果不加或和二维码的宽高一样,又可能降低识别率
.qrcode的left是控制位置,750-.ewm的宽度,再除二
.ewm { background-color: #e8e8e8; display: flex; justify-content: center; align-items: center; width: 440rpx; height: 440rpx; margin: 50rpx auto; } .qrcode { position: fixed; top: 490rpx; left: 175rpx; z-index: 2; }
// 绘制Qrcode ewmChange(id) { let size = {} size.w = wx.getSystemInfoSync().windowWidth / 750 * 400 size.h = size.w drawQrcode({ width: size.w, height: size.h, canvasId: 'myQrcode', text: id, }) },
把想转化为二维码的字符串通过id传给这个方法就可以在视图绘制出你想要的二维码啦!
快去试试吧