繁体   English   中英

在react中对密码字段进行自定义验证

[英]making custom validation for password field in react

我正在制作一个仅包含两个值的“电子邮件”和“密码”的自定义注册页面,稍后我还将添加确认密码,对于我的“密码”字段,我有一些限制,并且我使用了一些正则表达式和一些定制代码来进行验证。

这是我的validateField:

validateField(fieldName, value) {
    let fieldValidationErrors = this.state.formErrors;
    let emailValid = this.state.emailValid;
    let passwordValid = this.state.passwordValid;
    //let passwordValidConfirm = this.state.passwordConfirmValid;
    switch(fieldName) {
      case 'email':
        emailValid = value.match(/^([\w.%+-]+)@([\w-]+\.)+([\w]{2,})$/i);
        fieldValidationErrors.email = emailValid ? '' : ' is invalid';
        break;
      case 'password':
        passwordValid = (value.length >= 5 &&  value.length <= 32) && (value.match(/[i,o,l]/) === null) && /^[a-z]+$/.test(value) && this.check4pairs(value) && this.check3InRow(value);
        fieldValidationErrors.password = passwordValid ? '': ' is not valid';
        break;
      default:
        break;
    }
    this.setState({formErrors: fieldValidationErrors,
                    emailValid: emailValid,
                    passwordValid: passwordValid,
                    //passwordValidConfirm: passwordValidConfirm
                  }, this.validateForm);
  }

如您所见

passwordValid

我已经做了一些方法,这个

check3InRow

不能按照我希望的方式工作,请确保您的字符串中至少有3个字母连续出现,例如“ abc”,“ bce”或“ xyz”。

check3InRow(value){
    var counter3 = 0;
    var lastC = 0;
    for (var i = 0; i < value.length; i++) {
      if((lastC + 1) === value.charCodeAt(i)){
        counter3++;
        if(counter3 >= 3){
          alert(value);
          return true;
        }
      }
      else{
        counter3 = 0;
      }
      lastC = value.charCodeAt(i);
    }
    return false;
  }

这不能正常工作,因此应该接受以下内容:

aabcc

作为密码,但不能:

aabbc

您正在从0开始计数,并寻找大于等于3的值,对于连续3个字符,该值永远不会为3。 休息一切都很好用您的代码。

check3InRow(value) {
    var counter3 = 1;
    var lastC = 0;
    for (var i = 0; i < value.length; i++) {
        if ((lastC + 1) === value.charCodeAt(i)) {
            counter3++;
            if (counter3 >= 3) {
                alert(value);
                return true;
            }
        } else {
            counter3 = 1;
        }
        lastC = value.charCodeAt(i);
    }
    return false;
}

我们不能做那个功能的简单版本吗? 喜欢

function check3InRow2(value){
    for (var i = 0; i < value.length-2; i++) {
        const first = value.charCodeAt(i);
        const second = value.charCodeAt(i+1);
        const third = value.charCodeAt(i+2);
        if(Math.abs(second - first)  === 1 && Math.abs(third-second) === 1){
            return true;
        }
    }
    return false;
}

我的意思是说复杂度为O(N),所以也许我们可以尝试一下

还添加您的功能。 当您是一个字符时,应考虑使用1作为计数器。因为如果另一个匹配,它将是2个连续值。

function check3InRow(value) {
    var counter3 = 1;
    var lastC = value.charCodeAt(0);
    for (var i = 1; i < value.length; i++) {
        if ((lastC + 1) === value.charCodeAt(i)) {
            counter3++;
            if (counter3 >= 3) {
                return true;
            }
        } else {
            counter3 = 1;
        }
        lastC = value.charCodeAt(i);
    }
    return false;
}

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM