<el-form-item v-else label="密码" label-width='150px' prop="password"> <el-input :placeholder="info.password" v-model="info.password"></el-input> </el-form-item> <el-form-item v-else label="确认密码" label-width='150px' prop="repassword"> <el-input :placeholder="info.repassword" v-model="info.repassword"></el-input> </el-form-item> data() { var validatePass2 = (rule, value, callback) => { if (value === '') { callback(new Error('请再次输入密码')) } else if (value !== this.info.password) { callback(new Error('两次输入密码不一致!')) } else { callback() } } return { info: { }, rules: { password: [ { required: true, message: '请输入密码', trigger: 'blur' }, { pattern: /^(?![a-zA-Z]+$)(?![A-Z0-9]+$)(?![A-Z\W_]+$)(?![a-z0-9]+$)(?![a-z\W_]+$)(?![0-9\W_]+$)[a-zA-Z0-9\W_]{8,30}$/, message: '密码为数字，小写字母，大写字母，特殊符号 至少包含三种，长度为 8 - 30位，密码不能包含 用户名，公司名称(lidian), 公司域名(rekoon) （判断的时候不区分大小写)' } ], repassword: [ { required: true, validator: validatePass2, trigger: 'blur' } ] } } },
总结
以上所述是小编给大家介绍的vue.js+ElementUI实现进度条提示密码强度效果，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持！
如果你觉得本文对你有帮助，欢迎转载，烦请注明出处，谢谢！
您可能感兴趣的文章: