reactJS中的表单验证

问题描述

所以这不是问题，但是当我尝试验证表单时，我通常会使用大量的

if(){
}else if(){
}
.
.
.
else{
}

但是它既费时又使用干净的代码，实际上并不太好。 那么，有没有一种表单验证组件或更好的方法来做到这一点？ 任何参考都将非常有用。

解决方法

您可以将Formik与Yup一起使用

validation schema

 const SignupSchema = Yup.object().shape({
   firstName: Yup.string()
     .min(2,'Too Short!')
     .max(50,'Too Long!')
     .required('Required'),lastName: Yup.string()
     .min(2,email: Yup.string().email('Invalid email').required('Required'),});

很好的入门方法here

,

1. 如果您喜欢使用像formik这样的软件包，则可以使用@Yoel给出的答案。
2. 您具有可以使用的默认HTML5验证，并可以使用JS setCustomValidity() API设置验证消息。