Forms 在加载表单后重新加载/更新表单字段

我在使用redux表单进行登录表单字段验证时遇到问题。目前，我只是想让同步验证正常工作，以便检查基本错误。问题是表单似乎只在组件装载时检查验证，而在该点之后不再检查验证。以下是我的代码：

从“React”导入React；
从“redux form”导入{Field，reduxForm}；
从“react Redux”导入*作为Redux；
从“/../../helpers/Input”导入输入；
从“/../../helpers/Button”导入按钮；
export const Signup=React.createClass({
renderInput（{标签，类型，输入：{value}，元：{触摸，错误}）{
返回(
);
},
render（）{
const{handleSubmit}=this.props；
返回(
);
}
});
导出常量验证=值=>{
常量错误={}；
如果（！values.username）{
errors.username='Required'；
}else if（values.username.length>15）{
errors.username='必须少于15个字符'；
}
如果（！values.email）{
errors.email='必需'；
}如果（！/^[A-Z0-9.%+-]+@[A-Z0-9.-]+\[A-Z]{2,4}$/i.test（values.email））{
errors.email='无效的电子邮件地址'；
}
console.log（错误）；
返回错误；
};
导出默认reduxForm({
表格：'注册'，
验证
})（注册）

您没有将

onChange

处理程序传递给您的

Input

组件，因此redux表单不知道值已更改。

---

问题在于：

renderInput({ label, type, input: { value }, meta: { touched, error }}){
    return (
        <Input label={ label }
               type={ type }
               filled={ value ? true : false }
               touched={ touched }
               error={ error } />
    );
},

不要忘记将函数签名更改为

renderInput（{label，type，input，meta:{toucted，error}}）{…}

-

值

在这里被删除

---

或者，您可以显式地传递

onChange

：

 renderInput({ label, type, input: { value, onChange }, meta: { touched, error }}){
        return (
            <Input label={ label }
                   onChange = { onChange }
                   type={ type }
                   filled={ value ? true : false }
                   touched={ touched }
                   error={ error } />
        );
    },

renderInput（{label，type，input:{value，onChange}，meta:{toucted，error}）{
返回(
);
},

---

然后在你的

中使用

onChange

，我希望我能把这个投票提高100次。我在谷歌上搜索了一个小时。

 renderInput({ label, type, input: { value, onChange }, meta: { touched, error }}){
        return (
            <Input label={ label }
                   onChange = { onChange }
                   type={ type }
                   filled={ value ? true : false }
                   touched={ touched }
                   error={ error } />
        );
    },