1. 程式人生 > 其它 >(uniapp)uQRCode 二維碼生成外掛

(uniapp)uQRCode 二維碼生成外掛

uQRCode是uniapp內建的一個外掛 不用安裝依賴 直接引入即可

生成的二維碼

1、在 script 中引用元件

import uQRCode from '@/common/uqrcode.js'

2、在 template 中建立 canvas

<canvas  ref="canvas" canvas-id="qrcode" style="width: 180px;height:180px;" class="canvas" id="qrcode"></canvas>

3、在 script 中呼叫 make() 方法

async make() {
	// 可以在這加一個loading狀態
	await uQRCode.make({
		canvasId: 'qrcode',
		componentInstance: this,
		text: this.userInfo.useradd, // 這裡是你二維碼生成的url 替換即可
		size: 180,
		margin: 5,
		backgroundColor: '#ffffff',
		foregroundColor: '#000000'
	})
	// loading狀態在二維碼生成後關閉
},