antd 表单设置默认值initialValue后验证失效
方法一:
getFieldDecorator没有第三个参数,如果写了3个参数就会出错
错误代码:
<Form.Item>
{
getFieldDecorator(userName, { initialValue: Tom },{
rules: [{
required: true, message: 请输入用户名,
}],
})(
<Input placeholder=请输入用户名/>
)
}
</Form.Item>
正确代码:
<Form.Item>
{
getFieldDecorator(userName,{
initialValue:Tom,
rules:[
{required: true,message:请输入用户名}
]
})(
<Input placeholder=请输入用户名/>
)
}
</Form.Item>
方法二:通过setFieldsValue来设置默认值可以解决
this.props.form.setFieldsValue({
inputValue1:this.state.inputValue1,
inputValue2:this.state.inputValue2,
inputValue3:this.state.inputValue3,
});
如果还不能解决,查看是否在表单提交函数里写了验证代码
handleSubmit = (e) => {
e.preventDefault();
this.props.form.validateFields((err) => {
if (err) {
console.log(表单验证失败);
}else{
this.handleOk();//这里是表单验证成功执行的函数
}
});
};
参考:
