1. 下载uQrCode.js

下载地址:https://download.csdn.net/download/qq812457115/86705979

2. 把JS放到项目中、引入使用

<template>
	<view>
		<canvas canvas-id="qrcode" style="width:200px;height:200px;"/>
	</view>
</template>

<script>
	import uQrCode from "@/utils/uQrCode.js"
	
	export default {
		onLoad() {
			this.init()
		},
		methods: {
			init(){
				uQrCode.make({
					canvasId: 'qrcode',
					componentInstance: this,
					text: "https://www.baidu.com",
					size: 200,
					margin: 0,
					backgroundColor: '#ffffff',
					foregroundColor: '#000000',
					fileType: 'jpg',
					errorCorrectLevel: uQrCode.errorCorrectLevel.H,
					success: res => {}
				})
			}
		}
	}
</script>

属性 备注
canvasId 对应canvas 标签的canvas-id
componentInstance 当前组件的上下文
text 要生成二维码的内容
size 二维码大小
margin 二维码外边距(画布大小不变,二维码向内收缩)
backgroundColor 二维码背景色
foregroundColor 二维码前景色
success(res) 生成完回调,res:base码
Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐