前端案例—antd的表单项默认值提交时没有生效
<Form
onFinish={handleCommit}
initialValues={{"ruleApplyDate":{"type":0}}}
><Form.Item{...formItemLayout}label="规则应用时间"name="ruleApplyDate"requiredstyle={{ margin: "0" }}><Form.Itemname={["ruleApplyDate", "type"]}rules={[{required: true,message: "请选择规则应用时间",},]}><RadioGroupdefaultValue={ruleApplyDateOptions[0]}options={ruleApplyDateOptions}></RadioGroup></Form.Item></Form.Item>
</Form>
我想要给“规则应用时间”默认选中第一个选项,于是使用defaultValue属性,但是这样在onFinish提交的时候并不会生效。根据文档的描述如下:
被设置了 name
属性的 Form.Item
包装的控件,表单控件会自动添加 value
(或 valuePropName
指定的其他属性) onChange
(或 trigger
指定的其他属性),数据同步将被 Form 接管,这会导致以下结果:
- 你不再需要也不应该用
onChange
来做数据收集同步(你可以使用 Form 的onValuesChange
),但还是可以继续监听onChange
事件。 - 你不能用控件的
value
或defaultValue
等属性来设置表单域的值,默认值可以用 Form 里的initialValues
来设置。注意initialValues
不能被setState
动态更新,你需要用setFieldsValue
来更新。 - 你不应该用
setState
,可以使用form.setFieldsValue
来动态改变表单值。
第二条表明,不可以使用defaultValue 和 Value 来设置表单域的值,因此如果我们想要更新,可以使用Form 里的 initialValues
来设置。