redux表单,如果使用返回的函数,验证将中断

不要将验证函数包装到另一个函数中,每次呈现表单时,它都会构造一个新函数,这将导致字段重新呈现(因为 this.props.validate !== nextProps.validate )。(检查此项 issue on github )

可以使用特定定义的参数化验证规则实例:

const required = value => value ? undefined : 'Required';
const requiredMessage = required('Message');

<Field
    name="username"
    type="text"
    component={renderField}
    label="Username"
    validate={requiredMessage}
/>

此外,这也是表单组件中定义的验证函数无法工作的原因。

const FormComponent = (props) => {
    const {handleSubmit, submitting} = props;
    const required = value => value ? undefined : 'Required'; //this will not work!!!

    return <form onSubmit={handleSubmit}>
        <Field
            name='username'
            type='text'
            component={renderField}
            label='Username'
            validate={required}
        />
        <div>
            <button type="submit" disabled={submitting}>Submit</button>
        </div>
    </form>;
};