Search code examples
vue.jsvuelidate

vuelidate: validate items list that depend on its values


I need to validate the elements of a list in relation to a value of the element itself.

Is it possible or should I create a validation for each product?

new Vue({
    el: "#app",
  data: {
    text: '',
    sons: [
      {amount: 20, pending: 50}, 
      {amount: 30, pending: 150}
    ]
  },
  validations: {
    text: {
      required,
      minLength: minLength(5)
    },
    sons: {
      minLength: 3,
      $each: {
        amount: {
          maxValue: maxValue(this.sons[x].pending) // how to set x?
        }
      }
    }
  }
})

https://jsfiddle.net/e0tL4yph/


Solution

  • In the Vuelta repository, I published this question and the answer is:

    In that case you want to use the second argument of validation function.

    amount: {
      ltePending: (amount, { pending }) => amount <= pending
    }
    

    It works as I wanted!