getFieldDecorator is a method of the form, receiving two parameters
The first parameter is the field corresponding to the form
The second is the verification rule. The method itself returns a method, and the label for obtaining the value needs to be wrapped in it.
getFieldDecorator ("custom control name", {form rule}) ("value label")
<Form.Item>
{getFieldDecorator('userName', {
initialValue: 'Jack',
rules: [
{
required: true,
message: '请输入用户名',
},
{
max: 10,
message: '不得超过10个字符',
},
],
})(<Input/>)}
</Form.Item>
Effect:
When the component in the second bracket is wrapped with a bubble component <Popover></Popover>
Unable to detect changes in the content of the input box
<Form.Item>
{getFieldDecorator('userName', {
initialValue: 'Jack',
rules: [
{
required: true,
message: '请输入用户名',
},
{
max: 10,
message: '不得超过10个字符',
},
],
})(
<Popover content={content} title="Title">
<Input placeholder="请输入用户名" />
</Popover>
)}
</Form.Item>
getFieldValue:
Use getFieldValue to get the value of the control bound by getFieldDecorator
getFieldValue(`rules[${index}].name`) //自定义字段名字为变量的时候
getFieldValue('name')