Question

使用Vee-Validate，当将自定义验证器与确认的规则一起使用时，确认的规则始终会失败。自定义验证器在要确认的输入字段上指定，如下所示：

 <input type="password" placeholder="Password" data-vv-as="password" v-model="password" name="password" v-validate="'required|min:8|has_upper'" />
<input type="password" placeholder="Password" data-vv-as="confirm" v-model="confirmPassword" name="confirmPassword" v-validate="'required|confirmed:password'" />

这是我的Vue实例：

 (function (Vue, VeeValidate) {

        VeeValidate.Validator.extend('has_upper', {
            getMessage: function (field) {
                return 'The ' + field + ' must contain an upper case letter';
            },
            validate: function (value) {
                return /^(?=.*[A-Z]).+$/.test(value);

            }
        });
     Vue.use(VeeValidate);
        var enroll = {
            el: "#app",
            data: {
                password:'',
                confirmPassword: ''
            }

        }

        var app = new Vue(enroll);

    })(Vue, VeeValidate)

密码字段的自定义验证程序正在按预期方式触发，但是，如前所述，确认密码模型的确认规则始终失败。

Answer 1

最近在Vee-Validate（2.1.0及更高版本）中，他们更改了参数对它们的工作方式。现在，确认的目标必须是参考，所以这将起作用：

<input type="password" ref="password" name="password" v-validate="'required'" />
<input type="password" v-model="confirmPassword" name="confirmPassword" v-validate="'confirmed:password'" />

您真正需要做的唯一更改是在密码输入中添加ref="password"。

请参阅此处以了解有关此更改的作者的信息：https://github.com/baianat/vee-validate/issues/1415

到目前为止，我在文档中看不到任何更改，但我认为它会来的。

工作示例：https://codesandbox.io/s/km4lw12823

使用自定义验证程序的VeeValidate确认规则失败

1 个答案: