likes
comments
collection
share

React Ant Design Upload 组件定制开发: Form中如何初始化图片列表

作者站长头像
站长
· 阅读数 19

Upload组件在Form中使用,会处于受控状态,所以默认值如FileList的初始化需要通过Form的setFieldsValue方法来设

const [form] = Form.useForm();
form.setFieldsValue({
    banner: [{ uid: uuid().toString(), name: imageURL, status: 'done', url: imageURL}],
})
 
<Form.Item
    label="Banner图"
    name="banner"
    valuePropName="fileList"
    getValueFromEvent={normFile}
>
<Upload
    name="bannerUpload"
    customRequest={uploadHandler}
    >
        <Button icon={<UploadOutlined />}>上传图片</Button>
</Upload>
</Form.Item>