Vuelidate Issues with 'this' reference in a requireif

Question

I have a vuejs component that uses vuelidate. Here are my validations:

 validations: {
     invoice: {
         dueDate: {
             required,
         },
         tax: {
             required: requiredIf(function () {
                 return this.invoice.taxable;
             }),
        }
    },

I have a property called 'invoice' that has a property taxable (boolean) so I need to require the tax field if this property es set to true, but for some reason 'this' is 'undefined' at this moment. I've also tried with the arrow function, same result. I've used this in a vuejs instance in a js file but for some reason when I moved to a separate component it's not working. What am I doing wrong? Thanks in advance!

Answer 1

As it was suggested on by ssc-hrep it turns out that invoice is a nested model that should be passed as argument to the function:

validations: {
        invoice: {
            dueDate: {
                required,
            },
            tax: {
                required: requiredIf((invoice) => {
                    return invoice.taxable;
                }),
            }
        },