uni-app实现二维码以及小程序实现二维码

1.在uni-app插件市场下载uQRCode二维码生成插件
2.下载完成后在项目中找到uni_modules

3.如何使用

<template>
	<view class="content">
		<view class="title">uQRCode二维码生成</view>

		<view class="qrcode-box">
			<uqrcode ref="uqrcode" />
			<text class="text">canvas(256px)</text>
		</view>
		<view class="image-box">
			<image class="image" :src="qrcodeSrc" />
			<text class="text">image(400rpx)</text>
		</view>
		<input class="input" v-model="qrcodeText" placeholder="输入内容生成二维码" />
		<button class="button" type="primary" @tap="make">生成二维码</button>
		<button class="button" type="primary" @tap="save">保存二维码</button>

	</view>
</template>

<script>
	import uQRCode from '@/uni_modules/Sansnn-uQRCode/components/uqrcode/common/uqrcode'

	export default {
		data() {
			return {
				qrcodeSize: 256,
				qrcodeText: 'uQRCode 2.0.23 更新时间：2021-08-09',
				qrcodeSrc:""
			
			}
		},
		onLoad() {
			// 在onReady中调用绘制二维码方法，尽量不要在onLoad中
		},
		onReady() {
			this.make()
	
		},
		methods: {
			make() {
				uni.showLoading({
					mask: true,
					title: '生成中...'
				})
				this.$refs
					.uqrcode
					.make({
						size: this.qrcodeSize,
						text: this.qrcodeText,
						enableDelay: true // 启用延迟绘制
					})
					.then(res => {
						// 返回的res与uni.canvasToTempFilePath返回一致
						console.log(res)
						console.log(`生成二维码耗时：${res.time}ms`)
						this.qrcodeSrc = res.tempFilePath
					})
					.finally(() => {
						uni.hideLoading()
					})
			},
			save() {
				// #ifdef H5
				uni.showToast({
					icon: 'none',
					title: 'H5长按image保存'
				})
				return
				// #endif
				
				uni.saveImageToPhotosAlbum({
					filePath: this.qrcodeSrc,
					success: (res) => {
						uni.showToast({
							icon: 'success',
							title: '保存成功'
						})
					},
					fail: (err) => {
						uni.showToast({
							icon: 'none',
							title: JSON.stringify(err)
						})
					}
				})
			},
			
		
			
	}
</script>

<style>

</style>

4.如果是生成二维码，接口获取值,在给qrcodeText传入值在调用就可以了this.make()就行了