uniapp实现确认密码验证
实现验证两次密码一致
·
1.效果
2.表单代码
<u-form-item label="新密码:"
prop="password" borderBottom ref="item1" style="width: 55rpx;">
<u--input v-model="model2.password" border="none" type="password" :maxlength="20"
placeholder="请输入新密码"></u--input>
</u-form-item>
<u-form-item label="确认密码:"
prop="password1" borderBottom ref="item1" style="width: 60rpx;">
<u--input v-model="model2.password1" border="none" type="password" :maxlength="20"
placeholder="请再次输入新密码"></u--input>
</u-form-item>
3.验证规则
var validatePass = (rule, value, callback) => {
if (value === '') {
callback(new Error('请输入密码'));
} else {
callback();
}
};
var validatePass2 = (rule, value, callback) => {
if (value === '') {
callback(new Error('请再次输入密码'));
} else if (value !== this.model2.password) {
callback(new Error('两次输入密码不一致!'));
} else {
callback();
}
};
写在rules里面
password: [{
required: true,
message: '请输入密码',
trigger: 'blur'
},
{
min: 6,
max: 20,
message: '长度在 6 到 20 个字符',
trigger: 'blur'
},
{
validator: validatePass,
trigger: 'blur'
}
],
password1: [{
required: true,
message: '请确认密码',
trigger: 'blur'
},
{
min: 6,
max: 20,
message: '长度在 6 到 20 个字符',
trigger: 'blur'
},
{
validator: validatePass2,
trigger: 'blur',
required: true
}
]
更多推荐
已为社区贡献5条内容
所有评论(0)