修改密码验证规则(element ui)

 首先用户账号密码已经存在了数据库中,并且已经运用了本地缓存将账号密码存在了本地缓存,所以在验证原始密码的时候,直接在本地缓存中取出密码并且和用户输入的原始密码进行验证,当密码一致的时候,让他通过,进而执行下一步的新设密码.同理,再次输入密码和新设的密码验证也是如此

//原始密码
rules:{
    oldpwd:[
        {required:true, message:'请输入原始密码', trigger:'blur'},
        {validator:(rule,value,callback)=>{
            let userinfo = JSON.parse(localStorage.getItem('userinfo')) || ''
            if(userinfo != ''){
                if(value != userinfo.password){
                    callback(new Error('原始密码输入错误'))
                }else{
                    callback()
                }
            }
        }, trigger: 'blur'}
    ],
//新的密码
    newpwd:[
        {required:true, message:'请输入原始密码', trigger:'blur'},
        { min: 6, max: 18, message: '密码的长度在 6 到 20 个字符', trigger: 'blur' }
    ],
//确认密码
    repwd:[
        {required:true, message:'请输入原始密码', trigger:'blur'},
        {validator: (rule,value,callback)=>{
            if(value != this.ruleForm.newpwd){
                callback(new Error('两次输入的密码不一致'))
            }else{
                callback()
            }
        }, trigger:'blur'}
    ]
}

validator是一个自定义验证器,validator函数里面包含三个参数('rule','value','callback')

1. rule:

   这是一个对象，包含了当前验证规则的所有配置信息。比如，它可以包含是否必填(required)、触发验证的事件(trigger)、自定义的错误消息(message)等属性。在验证逻辑中，你可能不需要直接修改这个对象，但它可以提供一些上下文信息，比如了解该字段的其他验证需求。

2. value:

   这是需要被验证的表单项的值。在密码验证的场景下，value就是用户输入的密码字符串。验证逻辑会基于这个值来进行，比如检查密码长度、是否包含特定字符等。

3. callback:

   这是一个函数，用于在验证结束后通知Element UI验证结果。你需要在验证逻辑完成后调用它，并根据验证是否成功传入不同的参数：
   1.  如果验证失败，应该调用callback(new Error('错误信息'))，其中new Error('错误信息')是一个错误对象，包含你希望展示给用户的错误消息。
   2. 如果验证通过，你应该直接调用callback()或者callback(null)，表示没有错误发生。

注意 :

!!! required设置为true时,表示这一条数据是必须要填写的,不能为空

     message和上面的required配合使用,当用户不填写这一栏的时候,会提示message的信息

     trigger:'blur'是失去焦点时,立刻进行规则验证