定义表单规则（判断两次密码输入是否一致）

最新推荐文章于 2026-05-13 06:21:51 发布

原创最新推荐文章于 2026-05-13 06:21:51 发布 · 993 阅读

1 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#javascript

vue 专栏收录该内容

7 篇文章

订阅专栏

本文介绍了一个Vue.js组件中用于验证表单中确认密码输入的一段代码。该代码定义了一个自定义验证规则`validateRepassword`，确保用户输入的确认密码与原始密码一致，并且密码长度在6到15个字符之间。当密码不匹配或为空时，会显示相应的错误提示。

主要代码：{ required: true,validator: validateRepassword, trigger: "change" },

export default {
    name: "form",
    data() {
        var validateRepassword = (rule, value, callback) => {
            if (value === "") {
                callback(new Error("请输入确认密码"));
            } else if (value !== this.registerForm.password) {
                callback(new Error("两次的密码不一致"));
            } else {
                callback();
            }
        };
        return {
            registerForm: {
                password: "",
                repassword: "",
            },
            registerRules: {
                password: [
                    { required: true, trigger: "change", message: "密码不能为空" },
                    { min: 6, max: 15, message: '长度在 6 到 15 个字符', trigger: 'change' }
                ],
                repassword: [
                    { required: true,validator: validateRepassword, trigger: "change" },
                    { min: 6, max: 15, message: '长度在 6 到 15 个字符', trigger: 'change' }
                ],
            },
        };
    },
}

如果对我的其它文章有更多的兴趣，可以访问我的个人博客：uniqueho.xyz