feat(Uploader): add click-upload event (#9260)

src/uploader/README.md

@@ -280,6 +280,7 @@ export default {
 | Event | Description | Arguments |
 | --- | --- | --- |
 | oversize | Emitted when file size over limit | Same as after-read |
+| click-upload `v2.12.26` | Emitted when click upload area | _event: MouseEvent_ |
 | click-preview | Emitted when preview image is clicked | Same as after-read |
 | close-preview | Emitted when the full screen image preview is closed | - |
 | delete | Emitted when preview file is deleted | Same as after-read |

src/uploader/README.zh-CN.md

@@ -308,8 +308,9 @@ export default {
 ### Events
 
 | 事件名                  | 说明                   | 回调参数            |
-| ------------- | ---------------------- | --------------- |
+| ----------------------- | ---------------------- | ------------------- |
 | oversize                | 文件大小超过限制时触发 | 同 `after-read`     |
+| click-upload `v2.12.26` | 点击上传区域时触发     | _event: MouseEvent_ |
 | click-preview           | 点击预览图时触发       | 同 `after-read`     |
 | close-preview           | 关闭全屏图片预览时触发 | -                   |
 | delete                  | 删除文件预览时触发     | 同 `after-read`     |

src/uploader/index.js

@@ -249,6 +249,10 @@ export default createComponent({
       }
     },
 
+    onClickUpload(event) {
+      this.$emit('click-upload', event);
+    },
+
     onPreviewImage(item) {
       if (!this.previewFullImage) {
         return;
@@ -406,7 +410,11 @@ export default createComponent({
 
       if (slot) {
         return (
-          <div class={bem('input-wrapper')} key="input-wrapper">
+          <div
+            class={bem('input-wrapper')}
+            key="input-wrapper"
+            onClick={this.onClickUpload}
+          >
             {slot}
             {Input}
           </div>
@@ -423,7 +431,11 @@ export default createComponent({
       }
 
       return (
-        <div class={bem('upload', { readonly: this.readonly })} style={style}>
+        <div
+          class={bem('upload', { readonly: this.readonly })}
+          style={style}
+          onClick={this.onClickUpload}
+        >
           <Icon name={this.uploadIcon} class={bem('upload-icon')} />
           {this.uploadText && (
             <span class={bem('upload-text')}>{this.uploadText}</span>