reactjs - Redux 表单错误未定义

Question

为什么验证函数未定义错误？我在日志中打印错误，但在字段中未定义。当我尝试执行 field.meta.error 时，我得到一个未定义的信息。我把它放在 <input> 之后的 inputComponent const 中.

const inputComponent = function(field) {
  return (
    <div>
      <input { ...field.input } type={field.type} placeholder={field.placeholder} className={field.className} />
    </div>
  );
}

class Test extends Component {

  render() {

    <div>
       <Field name="name" component={inputComponent} type="email" placeholder="Email" />
       <Field name="password" component={inputComponent} type="password" placeholder="Password" />
    </div>

  }


function validate(values) {
  const errors = {};

  if(!values.name) {
    errors.categories = "Name error";
  }

  if(!values.password) {
    errors.categories = "Password error";
  }

  return errors;
}

}

Test = reduxForm({
  form: 'NameForm',
  validate
}, null, null)(Test);

export default connect(mapStateToProps, mapDispatchToProps)(Test);

Answer 1

当您从 validate 返回 errors 对象时，包含 Field 错误消息的键必须与该字段的 名称属性。

所以在这种情况下:

function validate(values) {
  const errors = {};

  if(!values.name) {
    errors.name = "Name error";
  }

  if(!values.password) {
    errors.password = "Password error";
  }

  return errors;
}

有关更多信息，我建议查看 this validation example来自 Redux-Form 文档。

希望这有帮助!