浏览代码

fix: 修复upload组件Android手机兼容问题

Drjingfubo 4 年之前
父节点
当前提交
11e2d597ea
共有 1 个文件被更改,包括 34 次插入3 次删除
  1. 34 3
      src/packages/uploader/uploader.vue

+ 34 - 3
src/packages/uploader/uploader.vue

@@ -1,8 +1,27 @@
 <template>
   <div class="nut-uploader">
     <slot></slot>
-    <input v-if="multiple" type="file" :name="name" @change="upload($event)" class="uploader" multiple :disabled="disabled" :accept="acceptType" />
-    <input v-else type="file" :name="name" @change="upload($event)" class="uploader" :disabled="disabled" :accept="acceptType" />
+    <input
+      v-if="multiple"
+      type="file"
+      :name="name"
+      @click="preventMoreClick"
+      @change="upload($event)"
+      class="uploader"
+      multiple
+      :disabled="newdisabled"
+      :accept="acceptType"
+    />
+    <input
+      v-else
+      type="file"
+      :name="name"
+      @click="preventMoreClick"
+      @change="upload($event)"
+      class="uploader"
+      :disabled="newdisabled"
+      :accept="acceptType"
+    />
   </div>
 </template>
 <script>
@@ -89,7 +108,9 @@ export default {
     }
   },
   data() {
-    return {};
+    return {
+      newdisabled: this.disabled
+    };
   },
   methods: {
     createUploaderOpts() {
@@ -126,6 +147,15 @@ export default {
         }
       };
     },
+    // 测试
+    preventMoreClick() {
+      setTimeout(() => {
+        this.newdisabled = true;
+      }, 0);
+      setTimeout(() => {
+        this.newdisabled = false; //点击一次时隔50豪秒后才能再次点击
+      }, 500);
+    },
     uploadData($event, selfData = {}, fileBlob = undefined) {
       const tar = $event.target;
       if (!this.url) {
@@ -163,6 +193,7 @@ export default {
       this.$emit('afterChange', tar, $event);
     },
     async upload($event) {
+      console.log(2222);
       if (typeof this.beforeUpload === 'function') {
         const promise = new Promise((reslove, reject) => {
           reslove(this.beforeUpload($event));