antd form重置某项值
时间: 2023-09-07 16:15:03 浏览: 265
antd form表单数据回显操作
5星 · 资源好评率100%
在 Ant Design 的 Form 组件中,可以使用 `form.setFieldsValue()` 方法来设置表单某个字段的值。
假设您需要重置表单中名称为 `myInput` 的输入框的值,您可以使用以下代码:
```jsx
import { Form, Input, Button } from "antd";
const MyForm = () => {
const [form] = Form.useForm(); // 获取 form 实例
const handleReset = () => {
form.setFieldsValue({ myInput: "" }); // 重置 myInput 字段的值为空字符串
};
return (
<Form form={form}>
<Form.Item name="myInput" label="My Input">
<Input />
</Form.Item>
<Form.Item>
<Button onClick={handleReset}>重置</Button>
</Form.Item>
</Form>
);
};
```
在这个示例中,我们使用 `Form.useForm()` 来获取 form 实例,然后在 `handleReset` 函数中使用 `form.setFieldsValue()` 方法来重置 `myInput` 字段的值为空字符串。
需要注意的是,我们在 `Form.Item` 中使用了 `name` 属性来指定字段的名称,然后在 `form.setFieldsValue()` 方法中使用该名称来指定要重置的字段。
阅读全文