reactJS中的表单验证

Question

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

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

但它既耗时，而且在干净的代码方面，它看起来并不好。那么，有没有一种表单验证组件或更好的方法来做到这一点？任何参考资料都非常有用。

Answer 1

您可以将Formik与Yup一起使用

验证模式

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

很高兴在这里开始

Answer 2

1. 如果你更喜欢使用formik这样的包，你可以使用@Yoel给出的答案
2. 您有默认HTML5验证，您可以使用该验证并使用JSsetCustomValidity()API设置验证消息