ant upload组件一次请求传输多张图片
时间: 2023-09-10 13:06:40 浏览: 202
一次性上传多张图片
4星 · 用户满意度95%
Ant Design 的 Upload 组件支持一次上传多张图片,你只需要将 `multiple` 属性设置为 `true` 即可。示例代码如下:
```jsx
import { Upload } from 'antd';
const props = {
name: 'file',
action: '/upload.do',
headers: {
authorization: 'authorization-text',
},
multiple: true, // 设置为 true 表示可以上传多张图片
onChange(info) {
if (info.file.status !== 'uploading') {
console.log(info.file, info.fileList);
}
if (info.file.status === 'done') {
message.success(`${info.file.name} file uploaded successfully`);
} else if (info.file.status === 'error') {
message.error(`${info.file.name} file upload failed.`);
}
},
};
<Upload {...props}>
<Button icon={<UploadOutlined />}>Click to Upload</Button>
</Upload>
```
注意,在后端接收到上传请求后,需要根据上传文件的数量进行相应的处理。如果上传文件数量过多,建议使用分片上传或者压缩文件后再上传。
阅读全文