uni-app 实现二维码生成

时间:2024-04-17 12:54:48

uni-app使用uqrcode实现二维码生成

 

需要使用 uqrcode页面引入该依赖:

import uQRCode from \'@/components/js-uqrcode/uqrcode.js\'

 

html代码:

<view class="qrcodebg">
    <canvas canvas-id="qrcode" />
</view>

 

css代码:

.qrcodebg canvas {
		margin-left: 25upx;
		width: 170upx;
		height: 170upx;
		border: #BBBBBB solid 5upx;
}

 

 

JS代码:

make() {
    uQRCode.make({
			canvasId: \'qrcode\',
			componentInstance: this,
			text: \'二维码内容\',
			size: uni.upx2px(170),//二维码大小
			backgroundColor: \'#ffffff\',//背景颜色
			foregroundColor: \'#000000\',
			fileType: \'png\',
			correctLevel: uQRCode.defaults.correctLevel,
			success: res => {
						
			}
	})
},

 

在onLoad调用方法

onLoad() {
    this.make();
}