我有一个使用正则表达式的组件来检查电子邮件格式的有效性。我将其作为onBlur函数附加到输入中,该输入useEffect
在页面加载后也作为React钩子的一部分在加载时运行。该功能应该检查是否为空字段并触发错误消息,提示用户输入电子邮件地址或选择退出。如果输入的电子邮件格式错误,则将引发单独的错误。在加载时,一切正常运行,并为空输入触发初始错误。用户输入输入字段并离开后,就会发生此问题。该函数将触发并设置错误,即使输入字段为空,也会提示用户输入有效的电子邮件。我已经换了东西,最初尝试通过将第一个检查设置为if(value === undefined || ''
但到目前为止,我得到的是相同的行为。有什么建议?
Functions for validation
function validateEmail(value) {
const errors = { hasError: false }
if (value === undefined || '') {
errors.email = 'Enter a valid email address or select Email Opt Out'
errors.hasError = true
return errors
}
if (!/\S+@\S+\.\S+/.test(value)) {
errors.email = 'Enter a valid email address'
errors.hasError = true
return errors
}
return errors
}
我能够运行一个条件正则表达式来检查该值是否有空格或根本没有值,这就是窍门!以下代码供任何人将来参考
Solution
function validateEmail(value) {
const errors = { hasError: false }
if (/\s/g.test(value) || !value) {
errors.email = 'Enter a valid email address or select Email Opt Out'
errors.hasError = true
return errors
}
if (!/\S+@\S+\.\S+/.test(value)) {
errors.email = 'Enter a valid email address'
errors.hasError = true
return errors
}
return errors
}
Original
function validateEmail(value) {
const errors = { hasError: false }
if (value === undefined || '') {
errors.email = 'Enter a valid email address or select Email Opt Out'
errors.hasError = true
return errors
}
if (!/\S+@\S+\.\S+/.test(value)) {
errors.email = 'Enter a valid email address'
errors.hasError = true
return errors
}
return errors
}
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句