uni-app自定义二维码扫描及本地图片扫描

最新推荐文章于 2025-06-16 11:48:29 发布

泛起回忆怎么潜

最新推荐文章于 2025-06-16 11:48:29 发布

阅读量2.2k

点赞数

CC 4.0 BY-SA版权

分类专栏： uni-app自定义二维码扫描及本地图片扫描文章标签： uni-app

本文链接：https://blog.youkuaiyun.com/qq_41823320/article/details/116135270

本文介绍了如何在uni-app中自定义实现二维码扫描功能，包括从本地选取图片进行扫描的详细步骤，涵盖了项目的结构配置和路由设置。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

结构

<template>
	<view class="scan">
	</view>
</template>
<script>
	let scan = null;
	export default {
		data() {
			return {
				flash: false,
				barcode: null
			}
		},
		onNavigationBarButtonTap() {
			uni.chooseImage({
				count: 1,
				sizeType: ['original', 'compressed'],
				sourceType: ['album'], //这要注意，camera掉拍照，album是打开手机相册
				success: (res) => {
					
					uni.getImageInfo({
						src:res.tempFilePaths[0],
						success:function(image){
							plus.barcode.scan(image.path, function(type, result) {
								console.log("扫描成功:(" + type + ")" + result);
							}, function(e) {
								console.log("Scan failed: " + JSON.stringify(e));
							});
						}
					})
				}
			});
		},
		mounted() {

			const currentWebview = this.$mp.page.$getAppWebview();
			this.barcode = plus.barcode.create('barcode', [plus.barcode.QR], {
				top: '0px',
				left: '0px',
				width: '100vw',
				height: '100vh',
				position: 'stati