Javascript 电子邮件验证（React Native）。将所有条目的结果返回为“无效”
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/43676695/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Email Validation (React Native). Returning the result as 'invalid' for all the entries
提问by Avikrit Khati
I am trying to validate a users email, by checking it against an expression. But the result i am getting is invalid for all the entries.
我正在尝试通过根据表达式检查用户电子邮件来验证它。但我得到的结果对所有条目都无效。
UPDATED CODE
更新代码
class dummytest extends Component{
constructor(props){
super(props);
this.state = {
email :'',
validated: false ,
}
};
go = () => {
const reg = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;
if (reg.test(this.state.email) === true){
alert( valid);
}
else{
alert();
}
}
render(){
return(
<View style={{alignSelf:'center',marginTop:100}}>
<TextInput autoCapitalize="none" autoCorrect={false} style={{height:20,width:200,backgroundColor:'blue'}} value={this.setState.email}/>
<Button onPress={this.go.bind(this)}>
<Text> GO </Text>
</Button>
</View>
);
}
}
回答by Neel Gala
Ok I got the code working, below you can take the look for validating the email on each user input :
好的，我让代码正常工作，在下面您可以查看验证每个用户输入的电子邮件：
- Your function part:
- 您的功能部分：
validate = (text) => {
console.log(text);
let reg = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;
if (reg.test(text) === false) {
console.log("Email is Not Correct");
this.setState({ email: text })
return false;
}
else {
this.setState({ email: text })
console.log("Email is Correct");
}
}
- You TextInput Component:
- 你 TextInput 组件：
<TextInput
placeholder="Email ID"
onChangeText={(text) => this.validate(text)}
value={this.state.email}
/>
回答by jaws
Looks like a syntax error. You've got a nested function called validatedirectly inside the definition for go.
看起来像一个语法错误。您已经validate在 的定义中直接调用了一个嵌套函数go。
As a general rule I would suggest to keep your indentation and curly-brackets consistent so these sort of errors are detectable at a glance-- when the brackets don't line up there's a problem.
作为一般规则，我建议您保持缩进和大括号一致，以便可以一目了然地检测到此类错误——当括号不对齐时，就会出现问题。
Then, there's a few things you might do to get this code working:
然后，您可能需要做一些事情才能使此代码正常工作：
- Remove the
validate (email)line along with its accompanying close bracket - Reference email via this.state.email in
go - Add an additional state variable to indicate if the email has been validated or not.
- 删除该
validate (email)行及其随附的右括号 - 通过 this.state.email 中的参考电子邮件
go - 添加额外的状态变量以指示电子邮件是否已通过验证。
Something like:
就像是：
this.state = {
email :'',
validated : false,
}
And...
和...
go = () => {
if (this.state.email.test(/^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/)==0) {
this.setState({ validated : true });
} else {
this.setState({ validated : false });
}
}
回答by Apurva Aggarwal
validate = (text) => {
console.log(text);
let reg = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/ ;
if(reg.test(text) === false)
{
alert("Email is Not Correct");
this.setState({email:text})
return false;
}
else {
this.setState({email:text})
alert("Email is Correct");
}
}
You can put this function validate in onChangeText propert of TextInput
回答by Gabriel P.
Having a function that validates the email (probably in some separate module as you are going to reuse it),
有一个验证电子邮件的功能（可能在某个单独的模块中，因为您要重用它），
export function validateIsEmail(email) {
return /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/.test(email);
}
You can validate email input,
您可以验证电子邮件输入，
Live validation:
实时验证：
<TextInput
...
onChangeText={emailText => {
setEmail(emailText);
setInlineValidations({
...inlineValidations,
emailNotValid: !validateIsEmail(emailText),
});
}}
/>
In this example setEmail and setInlineValidations are state setters defined by the useState hook, example const [email, setEmail] = useState('');, you can of course adapt this to your way of handling state.
在这个例子中， setEmail 和 setInlineValidations 是由 useState 钩子定义的状态设置器，例如 const [email, setEmail] = useState('');，您当然可以将其调整为您处理状态的方式。
回答by patel jigar
isEmailValid = () => {
const expression = /(?!.*\.{2})^([a-z\d!#$%&'*+\-\/=?^_`{|}~\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]+(\.[a-z\d!#$%&'*+\-\/=?^_`{|}~\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]+)*|"((([\t]*\r\n)?[\t]+)?([\x01-\x08\x0b\x0c\x0e-\x1f\x7f\x21\x23-\x5b\x5d-\x7e\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]|\[\x01-\x09\x0b\x0c\x0d-\x7f\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))*(([\t]*\r\n)?[\t]+)?")@(([a-z\d\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]|[a-z\d\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF][a-z\d\-._~\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]*[a-z\d\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])\.)+([a-z\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]|[a-z\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF][a-z\d\-._~\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]*[a-z\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])\.?$/i;
return expression.test(String(this.state.email_id).toLowerCase())
}
回答by Waqar UlHaq
I've created a Helper class and doing like this:
我创建了一个 Helper 类并这样做：
export default class Helper {
static isEmailValid(email) {
let reg = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;
return reg.test(email) == 0;
}
}
Call this method by:
通过以下方式调用此方法：
if (Helper.isEmailValid(this.state.emailText)) {
console.log("Email is correct");
} else {
console.log("Email is not correct");
}
