如何使用formRef.current.setFieldsValue修改组对象中的值
时间: 2024-04-15 15:29:17 浏览: 124
深入探讨:`document.currentScript`在JavaScript中的应用与实践
要使用`formRef.current.setFieldsValue`来修改表单组件中的字段值,您可以按照以下步骤进行操作:
1. 首先,在组件中创建一个表单引用(formRef)。例如,使用`useRef`钩子创建一个引用:
```jsx
import React, { useRef } from 'react';
import { Form, Input, Button } from 'antd';
const MyForm = () => {
const formRef = useRef();
const handleSubmit = () => {
// 使用setFieldsValue修改字段值
formRef.current.setFieldsValue({
name: 'New Value',
age: 30
});
};
return (
<Form ref={formRef}>
<Form.Item name="name" label="Name">
<Input />
</Form.Item>
<Form.Item name="age" label="Age">
<Input />
</Form.Item>
<Button onClick={handleSubmit}>Submit</Button>
</Form>
);
};
```
2. 在`handleSubmit`函数中,使用`formRef.current.setFieldsValue`来设置字段的新值。在这个例子中,我们将`name`字段的值设置为'New Value',将`age`字段的值设置为30。
请注意,使用`setFieldsValue`方法时,需要传递一个对象,其中键是表单字段的名称,值是要设置的新值。确保字段名称与表单组件中的`name`属性匹配。
这样,当点击Submit按钮时,表单中的字段值将被修改为新的值。
阅读全文