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

Question

我正在制作一个只有 2 个值电子邮件和密码的自定义注册页面，稍后我还将添加确认密码，对于我的密码字段，我有一些限制，我正在使用一些正则表达式和一些自定义代码来制作验证。

这是我的验证字段:

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

Answer 1

您的计数器从 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;
}