fix:删除摄像头初始化覆盖层,直接显示camera预览

pages/upload/camera_capture.vue

@@ -1,15 +1,8 @@
 <template>
 	<view class="cc-page">
 		<!-- 摄像头预览区 -->
-		<view class="cc-camera-wrap" v-if="useNativeCamera">
+		<view class="cc-camera-wrap">
-			<camera id="ccCamera" class="cc-camera" device-position="back" flash="off" @error="onCameraError" @initdone="onCameraInit"></camera>
+			<camera id="ccCamera" class="cc-camera" device-position="back" flash="off" @error="onCameraError"></camera>
-			<view class="cc-camera-hint" v-if="!ctxReady">
-				<text class="cc-hint-text">摄像头初始化中...</text>
-			</view>
-		</view>
-		<view class="cc-fallback" v-else>
-			<text class="cc-fallback-icon">📷</text>
-			<text class="cc-fallback-text">点击拍照按钮调用系统相机</text>
 		</view>
 
 		<!-- 已拍照九宫格 -->
@@ -29,7 +22,7 @@
 
 		<!-- 底部操作区 -->
 		<view class="cc-footer">
-			<view class="cc-capture-btn" @click="capturePhoto" :class="{ disabled: !canCapture }">
+			<view class="cc-capture-btn" @click="capturePhoto" :class="{ disabled: capturedList.length >= 9 }">
 				<view class="cc-capture-inner"></view>
 			</view>
 			<view class="cc-confirm-btn" @click="confirmCapture" :class="{ disabled: capturedList.length === 0 }">
@@ -44,68 +37,58 @@
 		data() {
 			return {
 				capturedList: [],
-				ctx: null,
+				ctx: null
-				ctxReady: false,
-				useNativeCamera: true,
-				initRetries: 0,
-				maxRetries: 10
-			}
-		},
-		computed: {
-			canCapture() {
-				return this.capturedList.length < 9 && (this.useNativeCamera ? this.ctxReady : true)
 			}
 		},
 		onReady() {
-			this.initCamera()
+			this.getCameraContext()
 		},
 		methods: {
-			initCamera() {
+			getCameraContext() {
 				try {
 					this.ctx = uni.createCameraContext()
-					if (this.ctx) {
+					console.log('摄像头上下文:', this.ctx ? '已获取' : '获取失败')
-						this.ctxReady = true
-						console.log('摄像头已就绪')
-					} else {
-						this.retryInit()
-					}
 				} catch (e) {
-					console.error('摄像头初始化失败:', e)
+					console.error('createCameraContext异常:', e)
-					this.retryInit()
 				}
-			},
+				// 若未就绪，每1秒重试，最多5秒
-			retryInit() {
+				if (!this.ctx) {
-				this.initRetries++
+					var count = 0
-				if (this.initRetries < this.maxRetries) {
+					var timer = setInterval(() => {
-					setTimeout(() => this.initCamera(), 500)
+						count++
-				} else {
+						try {
-					console.log('摄像头组件初始化超时，切换到系统相机模式')
+							this.ctx = uni.createCameraContext()
-					this.useNativeCamera = false
+							if (this.ctx) {
-					this.ctxReady = true
+								console.log('摄像头上下文获取成功')
+								clearInterval(timer)
+							}
+						} catch (e) {}
+						if (count >= 5) {
+							clearInterval(timer)
+							console.log('摄像头上下文获取超时')
+						}
+					}, 1000)
 				}
 			},
-			onCameraInit() {
-				console.log('摄像头initdone')
-				this.initCamera()
-			},
 			onCameraError(e) {
 				console.error('摄像头错误:', e)
-				this.useNativeCamera = false
+				uni.showToast({ title: '摄像头启动失败: ' + (e.detail || ''), icon: 'none' })
-				this.ctxReady = true
-				uni.showToast({ title: '切换到系统相机模式', icon: 'none' })
 			},
 			capturePhoto() {
 				if (this.capturedList.length >= 9) {
 					uni.showToast({ title: '最多拍9张', icon: 'none' })
 					return
 				}
-				if (this.useNativeCamera && this.ctx && this.ctxReady) {
+				if (!this.ctx) {
-					this.nativeCapture()
+					// 尝试重新获取
-				} else {
+					try {
-					this.systemCapture()
+						this.ctx = uni.createCameraContext()
+					} catch (e) {}
+				}
+				if (!this.ctx) {
+					uni.showToast({ title: '摄像头未就绪', icon: 'none' })
+					return
 				}
-			},
-			nativeCapture() {
 				uni.showLoading({ title: '拍照中...', mask: true })
 				this.ctx.takePhoto({
 					quality: 'high',
@@ -120,19 +103,6 @@
 					}
 				})
 			},
-			systemCapture() {
-				uni.chooseImage({
-					count: 1,
-					sourceType: ['camera'],
-					sizeType: ['original'],
-					success: (res) => {
-						if (res.tempFilePaths && res.tempFilePaths.length > 0) {
-							this.capturedList.push(res.tempFilePaths[0])
-						}
-					},
-					fail: () => {}
-				})
-			},
 			deletePhoto(idx) {
 				this.capturedList.splice(idx, 1)
 			},
@@ -170,37 +140,6 @@
 		width: 100%;
 		height: 100%;
 	}
-	.cc-camera-hint {
-		position: absolute;
-		top: 0;
-		left: 0;
-		right: 0;
-		bottom: 0;
-		display: flex;
-		align-items: center;
-		justify-content: center;
-		background: #111;
-	}
-	.cc-hint-text {
-		color: #999;
-		font-size: 28rpx;
-	}
-	.cc-fallback {
-		flex: 1;
-		display: flex;
-		flex-direction: column;
-		align-items: center;
-		justify-content: center;
-		background: #222;
-		gap: 16rpx;
-	}
-	.cc-fallback-icon {
-		font-size: 80rpx;
-	}
-	.cc-fallback-text {
-		color: #999;
-		font-size: 28rpx;
-	}
 	.cc-thumb-bar {
 		background: #1a1a1a;
 		padding: 16rpx 20rpx;
@@ -265,10 +204,6 @@
 		display: flex;
 		align-items: center;
 		justify-content: center;
-		transition: opacity 0.3s;
-	}
-	.cc-capture-btn.disabled {
-		opacity: 0.4;
 	}
 	.cc-capture-inner {
 		width: 64rpx;
@@ -279,6 +214,9 @@
 	.cc-capture-btn:active .cc-capture-inner {
 		background: #ccc;
 	}
+	.cc-capture-btn.disabled {
+		opacity: 0.4;
+	}
 	.cc-confirm-btn {
 		padding: 18rpx 40rpx;
 		border-radius: 40rpx;