Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Why doesn't it work when sameAs is used in vuelidate?

fieldName not found to vuelidate of sameAs method.

sameAs(blabla)

blabla = 'internalFormData.password', 'internalFormData.password.value', 'this.internalFormData.password', 'this.internalFormData.password.value', 'password', 'this.password', 'password.value'

-----------script----------
data () {
  return {
     internalFormData: {
        password: '',
        repassword: ''
      }
   }
},


validations: {
      password: {
        value: {
          required,
          minLength: minLength(8)
        }
      },
      repassword: {
        value: {
          required,
          minLength: minLength(8),
          sameAs: sameAs('internalFormData.password')
        }
      }
    }
  },



---------------template--------------
<error
   v-if="!$v.internalFormData.repassword.value.sameAs"
>
  비밀번호가 일치하지 않습니다.
<error>

The error won't go away.

like image 416
Jay Han Avatar asked Feb 17 '19 08:02

Jay Han


2 Answers

Your validations structure should mirror object(s) in data, thus it should be:

validations: {
  internalFormData: {
    password: {
      required,
      minLength: minLength(8)
    },
    repassword: {
      required,
      minLength: minLength(8),
      sameAs: sameAs('internalFormData.password')
    }
  }
}
like image 134
Styx Avatar answered Sep 25 '22 13:09

Styx


You need to point out your nested attribute with a function. Like this :

data(){return {
 password :{
  new: '',
  newRepeated:''
 }
}},    
validations : {
 password: {
  new : {required},
  newRepeated : {
   required,
   sameAs : sameAs( function(){return this.password.new} )
  }
 }
}

I would also suggest you to take a look at this closed issue. https://github.com/vuelidate/vuelidate/issues/252

like image 41
Taoufik Fekih Avatar answered Sep 26 '22 13:09

Taoufik Fekih