将架构与Formik集成时,yupError.inner未定义

时间:2019-07-29 20:14:25

标签: reactjs formik yup

我尝试将Yup的Schema验证与formik集成在一起。但是未定义为 yupError.inner的错误 这是codesandbox的链接!

我没有尝试太多。但是发现了这个错误报告。后来意识到可以解决。但是我仍然收到同样的消息。链接到问题#1486!。

// VALIDATION SCHEMA
const formSchema = Yup.object().shape({
    emailId: Yup.string("Enter a valid string")
      .email("Please enter a valid Email ID")
      .required("Need your Email ID, we won't spam you!"),
    confirmMail: Yup.string("Enter a valid string")
      .matches(Yup.ref("emailId"), "Email ID's are not matching")
      .required("Please enter a valid mailid"),
    mobileNo: Yup.number("Please enter number")
      .max(10, "You've entered more than 10 numbers")
      .min(10, "You've entered less than 10 numbers")
      .required("Password is required"),
    password: Yup.string("Enter a valid password").required(
      "Password field is required"
    ),
    confirmPassword: Yup.string("Enter a valid password").required(
      "Password fields are not matching"
    )
  });
          //Integration of Validation
          <Formik
            validate
            initialValues={this.initialValues}
            validationSchema={this.formSchema}
            onSubmit={this.handleSubmit}
          >
            {props => this.renderForm(props)}
          </Formik>

收到错误 yupError.inner未定义

2 个答案:

答案 0 :(得分:0)

问题是用于匹配电子邮件字段的自定义验证。我制作了一个叉子here,并使用this Github issue中的方法进行了修复,以便向Yup添加自定义验证方法以比较字段的相等性,该功能显然没有得到很好的支持。

答案 1 :(得分:0)

将yup累积到latest,并使用mixed().test()代替string().test()

示例:

passwordConfirm: Yup.mixed().test('is-same', 'Passwords not match.', value => value === values.newPassword)