vue 驗證兩次密碼

首先寫輸入框

                       <el-form-item label="修改密碼:" prop="newPassword">
                            <el-input
                                v-model="addForm.newPassword"
                                type="password"
                            />
                        </el-form-item>
                        <el-form-item label="確認密碼:" prop="confirmPassword">
                            <el-input
                                v-model="addForm.confirmPassword"
                                type="password"
                            />
                        </el-form-item>

復制代碼
之后定義規則
// 定義密碼驗證規則

        var validatePass = (rule, value, callback) => {
            if (value === "") {
                callback(new Error("請輸入密碼"));
            } else {
                if (this.addForm.confirmPassword !== "") {
                    this.$refs.addForm.validateField("confirmPassword");
                }
                callback();
            }
        };
        var validatePass2 = (rule, value, callback) => {
            if (value === "") {
                callback(new Error("請再次輸入密碼"));
            } else if (value !== this.addForm.newPassword) {
                callback(new Error("兩次輸入密碼不一致!"));
            } else {
                callback();
            }
        };

復制代碼
再定義數據

 addForm: {   
                newPassword: "",

                confirmPassword: ""
            },

復制代碼
在驗證規則內加上
// 表單驗證

            addRules: {
                newPassword: [
                    { validator: validatePass, trigger: ["blur", "change"] }
                ],

                confirmPassword: [
                    {
                        validator: validatePass2,

                        trigger: ["blur", "change"]
                    }
                ]
            },

復制代碼
這樣就可以了