fix: upload file-list is updated but without re-rendered (#2405) (#2460)

packages/upload/src/upload-list.vue

@@ -10,7 +10,7 @@
   >
     <li
       v-for="file in files"
-      :key="file"
+      :key="file.uid || file"
       :class="['el-upload-list__item', 'is-' + file.status, focusing ? 'focusing' : '']"
       tabindex="0"
       @keydown.delete="!disabled && handleRemove($event, file)"

packages/upload/src/useHandlers.ts

@@ -1,7 +1,6 @@
 
 import { ref, watch } from 'vue'
 import { NOOP } from '@vue/shared'
-import isEqual from 'lodash/isEqual'
 import cloneDeep from 'lodash/cloneDeep'
 
 // Inline types
@@ -21,7 +20,6 @@ function genUid(seed: number) {
 
 export default (props: IUseHandlersProps) => {
 
-  let cachedFiles: UploadFile[] = []
   const uploadFiles = ref<UploadFile[]>([])
   const uploadRef = ref<UploadRef>(null)
 
@@ -131,18 +129,14 @@ export default (props: IUseHandlersProps) => {
   })
 
   watch(() => props.fileList, (fileList: UploadFile[]) => {
-    if(!isEqual(cachedFiles, fileList)){
-      cachedFiles = []
-      uploadFiles.value = fileList.map(file => {
-        const cloneFile = cloneDeep(file)
-        cachedFiles.push(cloneFile)
-        return {
-          ...cloneFile,
-          uid: file.uid || genUid(tempIndex++),
-          status: file.status || 'success',
-        }
-      })
-    }
+    uploadFiles.value = fileList.map(file => {
+      const cloneFile = cloneDeep(file)
+      return {
+        ...cloneFile,
+        uid: file.uid || genUid(tempIndex++),
+        status: file.status || 'success',
+      }
+    })
   }, {
     immediate: true,
     deep: true,