Javascript 如何验证Vuejs中第四个字符处的确认密码字段?
Javascript 如何验证Vuejs中第四个字符处的确认密码字段?,javascript,vue.js,Javascript,Vue.js,密码:{ 必选:必选, minLength:minLength(8), }, 密码 必修的。 {{$v.password.$params.minLength.min}}个字母。 重复密码 必修的。 必须是相同的。 这里有一个简单的If()else{}方法 watch: { repeatPassword(v) { //checking repeat password length is 4 or greater then 4 if(v.le
密码:{
必选:必选,
minLength:minLength(8),
},
密码
必修的。
{{$v.password.$params.minLength.min}}个字母。
重复
密码
必修的。
必须是相同的。
这里有一个简单的If()else{}方法
watch: {
repeatPassword(v) {
//checking repeat password length is 4 or greater then 4
if(v.length >= 4){
//then checking if repeat password is same as password
if(v === this.password){
console.log('Passwords are same')
}else{
console.log('No a same password')
}
}else{
console.log('validate start after Repeat password length 4')
}
},
},
工作示例:如果您不想在
repeatPassword
包含少于4个字符时显示验证(顺便说一句,您需要该字符的原因很奇怪),那么只需在代码上添加&&repeatPassword.length>=4
,如下所示
<p v-if="$v.repeatPassword.$dirty && repeatPassword.length >= 4">
<!-- only display the validation when length >= 4 -->
<span class="form__alert" v-if="!$v.repeatPassword.required"
>Required.</span
>
<span class="form__alert" v-if="!$v.repeatPassword.sameAsPassword">
Must be identical.
</span>
</p>
必修的。
必须是相同的。
为什么要
.substring(0,value.length)
?如果密码为12345678
,重复密码为123
,则您的代码将通过该案例。我认为这是您想要的用户体验,从输入时验证更改为模糊(v-model=“password”@input=“$v.password.$touch”
到v-model.lazy=“password”@blur=“$v.password.$touch”
)。并删除.substring(0,value.length)
,因为它没有意义。现在sameAsPassword:(value,vm)=>value==vm.password
。为了获得更好的用户体验,请将提交按钮上的:disabled=“!agreement | | v.$invalid”
更改为:disabled=“!agreement”
。@LoiNguyenHuynh感谢您的回答,替换了上述给定的代码。但它仍然从confirmpassword字段中的第一个字符开始检查。但是需要检查一下,如果密码是12345678,重复密码是123。从第四个字符开始,我需要验证。如果1,2,3个字符不相同,则不应显示任何验证。@LoiNguyenHuynh这是在手表中尝试上述更改后的代码,但它是从第一个字符开始验证的。您是说所有验证都是必需的,其他内容是从第四个字符开始的?我的意思是,如果密码是12345678,重复密码是abc。从第4个字符开始,我需要验证。虽然在确认密码字段中,如果我给出的a、b、c字符不相同,则不应显示任何验证。将我的代码添加到您的代码中,我的代码与您所说的代码完全相同,但仍然相同。如果我错了,请纠正我。如果可能的话,请你在沙箱里纠正一下好吗