Commit 935d4fc12d46631e9ed465e4a0e68cfa822aac26

Authored by erniu
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>
src/components/Upload/src/UploadModal.vue
... ... @@ -187,8 +187,12 @@
187 187 item.status = UploadResultStatus.UPLOADING;
188 188 const { data } = await props.api?.(
189 189 {
190   - ...(props.uploadParams || {}),
  190 + data: {
  191 + ...(props.uploadParams || {}),
  192 + },
191 193 file: item.file,
  194 + name: props.name,
  195 + filename: props.filename,
192 196 },
193 197 function onUploadProgress(progressEvent: ProgressEvent) {
194 198 const complete = ((progressEvent.loaded / progressEvent.total) * 100) | 0;
... ...
src/components/Upload/src/props.ts
... ... @@ -34,6 +34,14 @@ export const basicProps = {
34 34 default: null,
35 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 47 export const uploadContainerProps = {
... ...
src/utils/http/axios/Axios.ts
... ... @@ -5,7 +5,7 @@ import axios from &#39;axios&#39;;
5 5 import qs from 'qs';
6 6 import { AxiosCanceler } from './axiosCancel';
7 7 import { isFunction } from '/@/utils/is';
8   -import { cloneDeep, omit } from 'lodash-es';
  8 +import { cloneDeep } from 'lodash-es';
9 9 import { ContentTypeEnum } from '/@/enums/httpEnum';
10 10 import { RequestEnum } from '/@/enums/httpEnum';
11 11  
... ... @@ -121,11 +121,17 @@ export class VAxios {
121 121 */
122 122 uploadFile<T = any>(config: AxiosRequestConfig, params: UploadFileParams) {
123 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 132 if (params.data) {
126 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 135 if (Array.isArray(value)) {
130 136 value.forEach((item) => {
131 137 formData.append(`${key}[]`, item);
... ... @@ -133,15 +139,9 @@ export class VAxios {
133 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 146 return this.axiosInstance.request<T>({
147 147 ...config,
... ...