如何在 React Native 中验证 TextInput 值?
IT技术
javascript
android
validation
reactjs
react-native
2021-04-26 08:47:15
2个回答
您可以使用正则表达式来检查输入的邮件是否有效。
正则函数
validateEmail = (email) => {
var re = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
return re.test(email);
};
提交文字输入功能
onSubmit = () => {
if (!this.validateEmail(this.state.text_input_email)) {
// not a valid email
} else {
// valid email
}
您可以使用onBlur
事件验证您的输入值TextInput
您可以在此事件上应用您的正则表达式或检查条件。
像这样:
<TextInput
onBlur= () => {
//Conditions or Regex
}
/>
在您的情况下,正则表达式功能:
validateEmail = (email) => {
var re = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
return re.test(email);
};
文本输入代码:
<TextInput
onBlur= () => {
if (!this.validateEmail(this.state.text_input_email)) {
// not a valid email
} else {
// valid email
}
}
/>
其它你可能感兴趣的问题