优化

src/components/FileUpload/index.vue

@@ -1,11 +1,28 @@
 <template>
   <div class="upload-file">
-    <el-upload ref="fileUploadRef" multiple :action="realUploadUrl" :before-upload="handleBeforeUpload"
-      :file-list="fileList" :limit="limit" :on-error="handleUploadError" :on-exceed="handleExceed"
-      :on-success="handleUploadSuccess" :show-file-list="showFileList" :headers="headers" class="upload-file-uploader"
-      :list-type="isConstruction ? 'picture-card' : 'text'" :accept="accept" :drag="isDarg" :data="data"
-      :auto-upload="autoUpload" :on-change="handleChange" :on-remove="handleRemove" :method="method"
-      :http-request="customUpload">
+    <el-upload
+      ref="fileUploadRef"
+      multiple
+      :action="realUploadUrl"
+      :before-upload="handleBeforeUpload"
+      :file-list="fileList"
+      :limit="limit"
+      :on-error="handleUploadError"
+      :on-exceed="handleExceed"
+      :on-success="handleUploadSuccess"
+      :show-file-list="showFileList"
+      :headers="headers"
+      class="upload-file-uploader"
+      :list-type="isConstruction ? 'picture-card' : 'text'"
+      :accept="accept"
+      :drag="isDarg"
+      :data="data"
+      :auto-upload="autoUpload"
+      :on-change="handleChange"
+      :on-remove="handleRemove"
+      :method="method"
+      :http-request="customUpload"
+    >
       <slot>
         <div>
           <!-- 上传按钮 -->
@@ -24,10 +41,14 @@
             的文件
           </div>
           <!-- 文件列表 -->
-          <transition-group v-if="!isConstruction && !isImportInfo"
-            class="upload-file-list el-upload-list el-upload-list--text" name="el-fade-in-linear" tag="ul" @click.stop>
-            <li style="margin-top: 10px" v-for="(file, index) in fileList" :key="file.uid"
-              class="el-upload-list__item ele-upload-list__item-content">
+          <transition-group
+            v-if="!isConstruction && !isImportInfo"
+            class="upload-file-list el-upload-list el-upload-list--text"
+            name="el-fade-in-linear"
+            tag="ul"
+            @click.stop
+          >
+            <li style="margin-top: 10px" v-for="(file, index) in fileList" :key="file.uid" class="el-upload-list__item ele-upload-list__item-content">
               <el-link :href="`${file.url}`" :underline="false" target="_blank">
                 <span class="el-icon-document"> {{ getFileName(file.name) }} </span>
               </el-link>
@@ -180,13 +201,16 @@ watch(
   },
   { deep: true, immediate: true }
 );
-watch(() => props.defaultFileList, () => {
-  if (props.defaultFileList.length === 0) return;
-  props.defaultFileList.forEach((item: any) => {
-    fileList.value.push(item);
-  });
-
-}, { deep: true, immediate: true });
+watch(
+  () => props.defaultFileList,
+  () => {
+    if (props.defaultFileList.length === 0) return;
+    props.defaultFileList.forEach((item: any) => {
+      fileList.value.push(item);
+    });
+  },
+  { deep: true, immediate: true }
+);
 // 上传前校检格式和大小
 const handleBeforeUpload = (file: any) => {
   // 校检文件类型
@@ -424,7 +448,7 @@ defineExpose({ submitUpload });
     }
   }
 
-  >span {
+  > span {
     width: 100%;
   }
 }