getFieldDecorator是form表单的一个方法,接收两个参数
第一个参数是表单对应的字段
第二个是验证规则 该方法本身返回一个方法,需要将获取值的标签包裹进去
getFieldDecorator ( “自定义控件名”,{ 表单规则 } ) (“取值标签” )
<Form.Item>
{getFieldDecorator('userName', {
initialValue: 'Jack',
rules: [
{
required: true,
message: '请输入用户名',
},
{
max: 10,
message: '不得超过10个字符',
},
],
})(<Input/>)}
</Form.Item>
效果:
第二个括号中的组件用一个气泡组件<Popover></Popover>包裹的时候
监听不到input输入框内容的变化
<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:文章来源:https://www.toymoban.com/news/detail-561192.html
使用getFieldValue的可以获取由getFieldDecorator绑定的控件的值文章来源地址https://www.toymoban.com/news/detail-561192.html
getFieldValue(`rules[${index}].name`) //自定义字段名字为变量的时候
getFieldValue('name')
到了这里,关于Antd中的getFieldDecorator用法和注意事项的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!