仅当复选框被勾选时才验证相同的密码

Question

我有一种用于登录和创建帐户的表格。勾选复选框时会添加其他字段。

<label for="createNewAccount" >Create account
  <input v-model="form.createNewAccount" type="checkbox" name="createNewAccount">
</label>

这 return 是一个布尔值。

data () {
    return {
      form:{
        admEmail: '',
        admPassWord: '',
        confPassWord: '',
        createNewAccount: false,
      }
    }
  },

我正在使用 vuelidate，但仅当 this.form.createNewAccount === true.

时，sameAs 内置验证器必须运行

这行得通（但我不知道如何将 this.form.createNewAccount 必须为真的要求引入运行）：

confPassWord: {
  myFunction: helpers.withMessage(
    `La confirmation ne correspond pas au mot de passe.`,
     sameAs(this.form.admPassWord)
   )
}

我试过这个：

validations () {
  return {
    form: {
      confPassWord: {
          myFunction: helpers.withMessage(
            `La confirmation ne correspond pas au mot de passe.`,
            (value) => { 
              if (this.form.createNewAccount === true) {
                value === this.form.admPassWord
              }
              return true       
            }
          )
        }

console.log(值 + this.form.admPassWord return 正确的值。

我希望此函数仅在 this.form.createNewAccount === true 时为运行，否则始终为 return true，在 value === this.form.admPassWord 时为 return false return 错误。

但是：它总是通过验证，包括当 this.form.createNewAccount 为真且密码不匹配时。

Answer 1

最简洁的修复是：

        (value) => { 
          return !this.form.createNewAccount || value === this.form.admPassWord;      
        }

一个更具可读性的修正是：

        (value) => { 
          return this.form.createNewAccount ? value === this.form.admPassWord : true;      
        }

仅当复选框被勾选时才验证相同的密码

vuelidate identical passwords only if checkbox is ticked

javascript

vuelidate

vuejs3