Commit 935d4fc12d46631e9ed465e4a0e68cfa822aac26
Committed by
GitHub
1 parent
2849743a
feat(Upload): 兼容ant-design-vue的upload属性 (#1247)
1. 兼容`name`属性,用于自定义发到后台的文件参数名; 2. 兼容`filename`属性 Co-authored-by: erniu <joe.cheng237@gmail.com>
Showing
3 changed files
with
23 additions
and
11 deletions
src/components/Upload/src/UploadModal.vue
@@ -187,8 +187,12 @@ | @@ -187,8 +187,12 @@ | ||
187 | item.status = UploadResultStatus.UPLOADING; | 187 | item.status = UploadResultStatus.UPLOADING; |
188 | const { data } = await props.api?.( | 188 | const { data } = await props.api?.( |
189 | { | 189 | { |
190 | - ...(props.uploadParams || {}), | 190 | + data: { |
191 | + ...(props.uploadParams || {}), | ||
192 | + }, | ||
191 | file: item.file, | 193 | file: item.file, |
194 | + name: props.name, | ||
195 | + filename: props.filename, | ||
192 | }, | 196 | }, |
193 | function onUploadProgress(progressEvent: ProgressEvent) { | 197 | function onUploadProgress(progressEvent: ProgressEvent) { |
194 | const complete = ((progressEvent.loaded / progressEvent.total) * 100) | 0; | 198 | const complete = ((progressEvent.loaded / progressEvent.total) * 100) | 0; |
src/components/Upload/src/props.ts
@@ -34,6 +34,14 @@ export const basicProps = { | @@ -34,6 +34,14 @@ export const basicProps = { | ||
34 | default: null, | 34 | default: null, |
35 | required: true, | 35 | required: true, |
36 | }, | 36 | }, |
37 | + name: { | ||
38 | + type: String as PropType<string>, | ||
39 | + default: 'file', | ||
40 | + }, | ||
41 | + filename: { | ||
42 | + type: String as PropType<string>, | ||
43 | + default: null, | ||
44 | + }, | ||
37 | }; | 45 | }; |
38 | 46 | ||
39 | export const uploadContainerProps = { | 47 | export const uploadContainerProps = { |
src/utils/http/axios/Axios.ts
@@ -5,7 +5,7 @@ import axios from 'axios'; | @@ -5,7 +5,7 @@ import axios from 'axios'; | ||
5 | import qs from 'qs'; | 5 | import qs from 'qs'; |
6 | import { AxiosCanceler } from './axiosCancel'; | 6 | import { AxiosCanceler } from './axiosCancel'; |
7 | import { isFunction } from '/@/utils/is'; | 7 | import { isFunction } from '/@/utils/is'; |
8 | -import { cloneDeep, omit } from 'lodash-es'; | 8 | +import { cloneDeep } from 'lodash-es'; |
9 | import { ContentTypeEnum } from '/@/enums/httpEnum'; | 9 | import { ContentTypeEnum } from '/@/enums/httpEnum'; |
10 | import { RequestEnum } from '/@/enums/httpEnum'; | 10 | import { RequestEnum } from '/@/enums/httpEnum'; |
11 | 11 | ||
@@ -121,11 +121,17 @@ export class VAxios { | @@ -121,11 +121,17 @@ export class VAxios { | ||
121 | */ | 121 | */ |
122 | uploadFile<T = any>(config: AxiosRequestConfig, params: UploadFileParams) { | 122 | uploadFile<T = any>(config: AxiosRequestConfig, params: UploadFileParams) { |
123 | const formData = new window.FormData(); | 123 | const formData = new window.FormData(); |
124 | + const customFilename = params.name || 'file'; | ||
125 | + | ||
126 | + if (params.filename) { | ||
127 | + formData.append(customFilename, params.file, params.filename); | ||
128 | + } else { | ||
129 | + formData.append(customFilename, params.file); | ||
130 | + } | ||
124 | 131 | ||
125 | if (params.data) { | 132 | if (params.data) { |
126 | Object.keys(params.data).forEach((key) => { | 133 | Object.keys(params.data).forEach((key) => { |
127 | - if (!params.data) return; | ||
128 | - const value = params.data[key]; | 134 | + const value = params.data![key]; |
129 | if (Array.isArray(value)) { | 135 | if (Array.isArray(value)) { |
130 | value.forEach((item) => { | 136 | value.forEach((item) => { |
131 | formData.append(`${key}[]`, item); | 137 | formData.append(`${key}[]`, item); |
@@ -133,15 +139,9 @@ export class VAxios { | @@ -133,15 +139,9 @@ export class VAxios { | ||
133 | return; | 139 | return; |
134 | } | 140 | } |
135 | 141 | ||
136 | - formData.append(key, params.data[key]); | 142 | + formData.append(key, params.data![key]); |
137 | }); | 143 | }); |
138 | } | 144 | } |
139 | - formData.append(params.name || 'file', params.file, params.filename); | ||
140 | - const customParams = omit(params, 'file', 'filename', 'file'); | ||
141 | - | ||
142 | - Object.keys(customParams).forEach((key) => { | ||
143 | - formData.append(key, customParams[key]); | ||
144 | - }); | ||
145 | 145 | ||
146 | return this.axiosInstance.request<T>({ | 146 | return this.axiosInstance.request<T>({ |
147 | ...config, | 147 | ...config, |