fix(uploader): 修复data外部修改后提交时依然是旧值问题

Author: xiaohe0601

src/packages/__VUE/uploader/doc.en-US.md

@@ -366,8 +366,8 @@ const clearUpload = () => {
 | name | File name | - |
 | url | File path | - |
 | type | File type | `"image/jpeg" ` |
-| formData | Upload the required data | `new FormData()` |
 | percentage | Upload percentage | `0` |
+| sourceFile | Upload the required file | - |
 
 ### Events
 

src/packages/__VUE/uploader/doc.md

@@ -367,8 +367,8 @@ const clearUpload = () => {
 | name | 文件名称 | - |
 | url | 文件路径 | - |
 | type | 文件类型 | `"image/jpeg"` |
-| formData | 上传所需的 data | `new FormData() ` |
 | percentage | 上传百分比 | `0` |
+| sourceFile | 上传所需的 file | - |
 
 ### Events
 

src/packages/__VUE/uploader/doc.taro.md

@@ -282,8 +282,8 @@ const clearUpload = () => {
 | uid | 文件的唯一标识 | `new Date().getTime().toString()` |
 | name | 文件名称 | - |
 | url | 文件路径 | - |
-| formData | 上传所需的 data | `{}` |
 | percentage | 上传百分比 | `0` |
+| sourceFile | 上传所需的 file（仅WEB） | - |
 
 ### Events
 

src/packages/__VUE/uploader/index.taro.vue

@@ -281,10 +281,21 @@ export default create({
 
     const executeUpload = (fileItem: FileItem, index: number) => {
       const uploadOption = new UploadOptions()
+
+      if (Taro.getEnv() == 'WEB') {
+        const formData = new FormData()
+        for (const [key, value] of Object.entries(props.data)) {
+          formData.append(key, value)
+        }
+        formData.append(props.name, fileItem.sourceFile!)
+        uploadOption.formData = formData
+      } else {
+        uploadOption.formData = props.data as FormData
+      }
+
       uploadOption.name = props.name
       uploadOption.url = props.url
       uploadOption.fileType = fileItem.type
-      uploadOption.formData = fileItem.formData
       uploadOption.timeout = (props.timeout as number) * 1
       uploadOption.method = props.method
       uploadOption.xhrState = props.xhrState as number
@@ -381,18 +392,13 @@ export default create({
         fileItem.status = 'ready'
         fileItem.message = translate('waitingUpload')
         fileItem.type = fileType
+
         if (Taro.getEnv() == 'WEB') {
-          const formData = new FormData()
-          for (const [key, value] of Object.entries(props.data)) {
-            formData.append(key, value)
-          }
-          formData.append(props.name, file.originalFileObj as Blob)
+          fileItem.sourceFile = file.originalFileObj
           fileItem.name = file.originalFileObj?.name
           fileItem.type = file.originalFileObj?.type
-          fileItem.formData = formData
-        } else {
-          fileItem.formData = props.data
         }
+
         if (props.isPreview) {
           fileItem.url = fileType == 'video' ? file.thumbTempFilePath : filepath
         }

src/packages/__VUE/uploader/index.vue

@@ -185,20 +185,22 @@ export default create({
     }
 
     const executeUpload = (fileItem: FileItem, index: number) => {
+      const formData = new FormData()
+      for (const [key, value] of Object.entries(props.data)) {
+        formData.append(key, value)
+      }
+      formData.append(props.name, fileItem.sourceFile!)
+
       const uploadOption = new UploadOptions()
       uploadOption.url = props.url
-      uploadOption.formData = fileItem.formData
+      uploadOption.formData = formData
       uploadOption.timeout = (props.timeout as number) * 1
       uploadOption.method = props.method
       uploadOption.xhrState = props.xhrState as number
       uploadOption.headers = props.headers
       uploadOption.withCredentials = props.withCredentials
       uploadOption.beforeXhrUpload = props.beforeXhrUpload
-      try {
-        uploadOption.sourceFile = fileItem.formData.get(props.name)
-      } catch (error) {
-        console.warn('[NutUI] <Uploader> formData.get(name)', error)
-      }
+      uploadOption.sourceFile = fileItem.sourceFile
       uploadOption.onStart = (option: UploadOptions) => {
         fileItem.status = 'ready'
         fileItem.message = translate('readyUpload')
@@ -260,17 +262,11 @@ export default create({
 
     const readFile = (files: File[]) => {
       files.forEach((file: File, index: number) => {
-        const formData = new FormData()
-        for (const [key, value] of Object.entries(props.data)) {
-          formData.append(key, value)
-        }
-        formData.append(props.name, file)
-
         const fileItem = reactive(new FileItem())
         fileItem.name = file.name
         fileItem.status = 'ready'
         fileItem.type = file.type
-        fileItem.formData = formData
+        fileItem.sourceFile = file
         fileItem.message = translate('waitingUpload')
         executeUpload(fileItem, index)
 

src/packages/__VUE/uploader/type.ts

@@ -11,5 +11,5 @@ export class FileItem {
   type?: string
   path?: string
   percentage: string | number = 0
-  formData: any = {}
+  sourceFile?: File
 }