element-ui的密码验证

<el-form :model="form" :rules="rules" ref="ruleForm" >
  <el-form-item label="新密码" label-width="200px" prop="passwd">
    <el-input v-model="form.passwd" placeholder="密码必须包含字母,数字,特殊字符,且大于8位"></el-input>
  </el-form-item>
</el-form>

对应的规则:

data() {
     
    return {
     
      form: {
     },
      dialogFormVisible: false,
      rules: {
     
        passwd: [
            {
      required: true, message: '请输入密码', trigger: 'blur' },
            {
     
              trigger: 'blur',
              validator: (rule, value, callback) => {
     
                var passwordreg = /(?=.*\d)(?=.*[a-zA-Z])(?=.*[^a-zA-Z0-9]).{8,20}/
                if (!passwordreg.test(value)) {
     
                  callback(new Error('密码必须由数字、字母、特殊字符组合,请输入8-20位'))
                }else{
     
                  callback()
                }
              }
            }
        ]
      }
    };
  },

你可能感兴趣的:(前端小案例)