【新功能征集】u-upload 支持关闭upload-text、允许设置点击已选图片效果为预览或者重选

[CyJaySong]

🚀 新功能征集 | Feature Request

说明

u-upload新增show-upload-text参数，默认 true，传递false时不显示uploadBtnText

u-upload新增selected-image-action参数，默认为preview，可选值为'preview' | 'replace'，设置为'replace' 时点击已选图片直接打开选择器

• 不预先清空旧图；用户取消选择时旧图还在
• 选择新图后，内部替换当前图片，再触发原有 on-choose-complete

diff --git a/components/u-upload/types.ts b/components/u-upload/types.ts
index 0a52b86cb18c716c01fbf527e96f87c2961bcde0..3da14ce449b85a4a79fe3bc20901575df290ab51 100644
--- a/components/u-upload/types.ts
+++ b/components/u-upload/types.ts
@@ -46,6 +46,8 @@ export const UploadProps = {
     customBtn: { type: Boolean, default: false },
     /** 上传按钮文字 */
     uploadText: { type: String, default: '' },
+    /** 是否显示默认上传按钮文字 */
+    showUploadText: { type: Boolean as PropType<boolean>, default: true },
     /** 上传地址 */
     action: { type: String, default: '' },
     /** 是否禁用 */
@@ -66,6 +68,8 @@ export const UploadProps = {
     previewFullImage: { type: Boolean, default: true },
     /** 是否可预览文件 */
     previewFile: { type: Boolean, default: true },
+    /** 点击已选资源时的行为：预览或重新选择 */
+    selectedAction: { type: String as PropType<'preview' | 'replace'>, default: 'preview' },
     /** 是否支持多选 */
     multiple: { type: Boolean, default: true },
     /** 单个文件最大大小，单位B(byte)，默认不限制 */
diff --git a/components/u-upload/u-upload.vue b/components/u-upload/u-upload.vue
index 63a759876d089eb837c7745f018fc63a4c5d9662..6b0be872f9d44f0d1c5bc45a9a13c580194d6e65 100644
--- a/components/u-upload/u-upload.vue
+++ b/components/u-upload/u-upload.vue
@@ -15,7 +15,7 @@
                     :class="{ 'u-upload-list__item--error': item.error }"
                 >
                     <!-- 左侧：图片缩略图或文件图标 -->
-                    <view class="u-upload-list__left" @tap.stop="handlePreview(item, index)">
+                    <view class="u-upload-list__left" @tap.stop="handleSelectedItemTap(item, index)" @longpress.stop="handleSelectedItemLongPress(item, index)">
                         <!-- 图片类型：显示缩略图 -->
                         <template v-if="isImageFile(item)">
                             <image
@@ -38,7 +38,7 @@
                     </view>
 
                     <!-- 中间：文件名和大小 -->
-                    <view class="u-upload-list__center" @tap.stop="handlePreview(item, index)">
+                    <view class="u-upload-list__center" @tap.stop="handleSelectedItemTap(item, index)" @longpress.stop="handleSelectedItemLongPress(item, index)">
                         <text
                             v-if="showFileName && item.name"
                             class="u-upload-list__name"
@@ -105,7 +105,7 @@
                     hover-stay-time="150"
                 >
                     <u-icon name="plus" size="32" :color="$u.color.primary"></u-icon>
-                    <text class="u-upload-list__add-text">{{ uploadBtnText }}</text>
+                    <text v-if="showUploadText" class="u-upload-list__add-text">{{ uploadBtnText }}</text>
                 </view>
             </view>
         </template>
@@ -158,7 +158,8 @@
                             :class="{ 'u-upload-grid__image--circle': props.imageShape === 'circle' }"
                             :src="item.url || item.path"
                             :mode="imageMode"
-                            @tap.stop="handlePreview(item, index)"
+                            @tap.stop="handleSelectedItemTap(item, index)"
+                            @longpress.stop="handleSelectedItemLongPress(item, index)"
                         ></image>
                     </template>
 
@@ -220,7 +221,7 @@
                     }"
                 >
                     <u-icon name="plus" class="u-upload-grid__add-icon" size="40"></u-icon>
-                    <view class="u-upload-grid__add-text">{{ uploadBtnText }}</view>
+                    <view v-if="showUploadText" class="u-upload-grid__add-text">{{ uploadBtnText }}</view>
                 </view>
             </view>
         </template>
@@ -795,6 +796,14 @@ function chooseFile() {
  */
 function handleFilesSelected(files: any[], sourceType: 'image' | 'video' | 'media' | 'file') {
     let listOldLength = lists.value.length;
+    const shouldReplaceSelected =
+        props.selectedAction === 'replace' &&
+        !props.multiple &&
+        lists.value.length > 0;
+    if (shouldReplaceSelected) {
+        lists.value = [];
+        listOldLength = 0;
+    }
 
     files.forEach((val: any, index: number) => {
         // 检查文件后缀是否允许
@@ -1158,6 +1167,26 @@ function openDocument(item: UploadFileItem) {
     // #endif
 }
 
+/**
+ * 已选资源点击行为，默认预览，可配置为重新选择并替换当前资源
+ */
+function handleSelectedItemTap(item: UploadFileItem, index: number) {
+    if (props.selectedAction === 'replace') {
+        selectFile();
+        return;
+    }
+    handlePreview(item, index);
+}
+
+/**
+ * 仅在点击行为为替换时，长按保留预览入口
+ */
+function handleSelectedItemLongPress(item: UploadFileItem, index: number) {
+    if (props.selectedAction === 'replace') {
+        handlePreview(item, index);
+    }
+}
+
 /**
  * 统一处理预览
  */

[CyJaySong]

@anyup 这个不考虑一下吗