antdesignpro 上传图片
时间: 2023-10-10 14:11:27 浏览: 88
要在 antdesignpro 中上传图片,您可以使用 Upload 组件。以下是一个示例代码,可以将其添加到您的项目中:
```jsx
import { Upload, Button } from 'antd';
import { UploadOutlined } from '@ant-design/icons';
const props = {
name: 'file',
action: 'https://www.mocky.io/v2/5cc8019d300000980a055e76',
headers: {
authorization: 'authorization-text',
},
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 />}>Upload</Button>
</Upload>
```
在上面的示例代码中,您需要将 `action` 属性设置为服务器端接收上传文件的 URL。您还可以使用 `headers` 属性设置请求头。当上传状态发生变化时,`onChange` 函数将被调用,您可以在其中进行相应的处理,例如打印上传的文件信息或显示上传结果的反馈信息。
阅读全文