diff --git a/examples/single-image-upload-usage.vue b/examples/single-image-upload-usage.vue deleted file mode 100644 index 05bfb37..0000000 --- a/examples/single-image-upload-usage.vue +++ /dev/null @@ -1,318 +0,0 @@ - - - - - \ No newline at end of file diff --git a/pages.json b/pages.json index e193c88..0a723a7 100644 --- a/pages.json +++ b/pages.json @@ -98,13 +98,6 @@ "style": { "navigationBarTitleText": "图片上传" } - }, - { - "path": "pages/image-upload-demo/image-upload-demo", - "style": { - "navigationBarTitleText": "图片上传演示", - "navigationStyle": "custom" - } } ], "tabBar": { diff --git a/pages/image-upload-demo/image-upload-demo.vue b/pages/image-upload-demo/image-upload-demo.vue deleted file mode 100644 index 48f73a8..0000000 --- a/pages/image-upload-demo/image-upload-demo.vue +++ /dev/null @@ -1,174 +0,0 @@ - - - - - \ No newline at end of file diff --git a/pages/image-upload/image-upload.vue b/pages/image-upload/image-upload.vue index a084a7f..4c9ad80 100644 --- a/pages/image-upload/image-upload.vue +++ b/pages/image-upload/image-upload.vue @@ -117,36 +117,16 @@ export default { icon: 'success', }) - // 返回上一页并传递图片URL - const pages = getCurrentPages() - const prevPage = pages[pages.length - 2] + // 先触发事件,再返回上一页 + console.log('触发图片上传成功事件:', this.uploadResult) + uni.$emit('image-upload-success', this.uploadResult) - if (prevPage) { - // 如果上一页存在,可以通过事件总线或其他方式传递数据 - // 这里我们通过URL参数的方式返回 - uni.navigateBack({ - success: () => { - // 延迟执行,确保页面已经返回 - setTimeout(() => { - uni.$emit('image-upload-success', this.uploadResult) - }, 100) - }, - }) - } else { - // 如果没有上一页,直接返回URL参数 + // 延迟返回,确保事件被处理 + setTimeout(() => { uni.navigateBack({ delta: 1, - success: () => { - // 通过URL参数传递结果 - const currentPage = getCurrentPages()[getCurrentPages().length - 1] - if (currentPage && currentPage.onLoad) { - currentPage.onLoad({ - imageUrl: encodeURIComponent(this.uploadResult), - }) - } - }, }) - } + }, 2000) } catch (error) { console.error('上传失败:', error) this.errorMessage = error.message || '上传失败' diff --git a/pages/requestWithdrawal/addCard.vue b/pages/requestWithdrawal/addCard.vue index 9369a62..4f182ff 100644 --- a/pages/requestWithdrawal/addCard.vue +++ b/pages/requestWithdrawal/addCard.vue @@ -16,12 +16,18 @@ {{ typeOptions[typeIndex].noLabel }} - + + + + + 上传 + + @@ -115,6 +121,22 @@ export default { } }, }, + onLoad() { + // 监听图片上传成功事件 + uni.$on('image-upload-success', this.onImageUploadSuccess) + }, + onShow() { + // 页面显示时也监听事件,确保弹窗重新打开时能接收到事件 + uni.$on('image-upload-success', this.onImageUploadSuccess) + }, + onUnload() { + // 移除事件监听 + uni.$off('image-upload-success', this.onImageUploadSuccess) + }, + onHide() { + // 页面隐藏时移除事件监听 + uni.$off('image-upload-success', this.onImageUploadSuccess) + }, methods: { // 重置表单 resetForm() { @@ -196,6 +218,23 @@ export default { return true }, + // 跳转到图片上传页面 + goToImageUpload() { + uni.navigateTo({ + url: '/pages/image-upload/image-upload' + }) + }, + + // 处理图片上传成功 + onImageUploadSuccess(imageUrl) { + console.log('接收到图片上传成功事件:', imageUrl) + this.bankForm.no = imageUrl + uni.showToast({ + title: '图片上传成功', + icon: 'success' + }) + }, + // 提交表单 async handleSubmit() { if (!this.validateForm()) { @@ -321,6 +360,39 @@ export default { display: flex; align-items: center; } + + .input-group { + display: flex; + align-items: center; + gap: 15rpx; + + .form-input { + flex: 1; + } + + .upload-btn { + width: 120rpx; + height: 80rpx; + background: #ff803a; + border-radius: 10rpx; + display: flex; + align-items: center; + justify-content: center; + cursor: pointer; + transition: all 0.3s ease; + + &:active { + background: #e67333; + transform: scale(0.95); + } + + .upload-text { + color: #fff; + font-size: 26rpx; + font-weight: 500; + } + } + } } }