Vuelidate: How to handle a non-homogenous list?

[jfis]

https://jsfiddle.net/b5v4faqf/209/

Hopefully this fiddle illustrates my problem.

I want to require onlyA.nestedA when type == 'a' and onlyB when type == 'b'
Ideally, it wouldn't even try to validate onlyB when type == 'a', likewise for onlyA and its children when type == 'b'

Also, a validator on nestedA can't access above onlyA in order check the type. I thought maybe I could from the other direction through "this" but there's no way to know which element of the list it is currently validating.

Maybe there is a totally different approach?

As of now, I am forced to split the lists into 2 lists, which might seem fine in this trivial example, but in my real situation is not ideal.

Hopefully I am just missing some important concept.

Thanks!

[Frizi]

There are ways.

If your validators have to have dynamic shape based on your model, you can always use functional validations. That's the general way of doing things when you have very specific funky requirements.

Here is an example of how you could do that.
https://jsfiddle.net/b5v4faqf/212/

Notice i had to get rid of $each, as the new validation is not "autogenerated", but directly follows the specific tree. I also had to spread the array into the object, as arrays have different meaning than objects for validations (that would be a validation group).

[jfis]

Thank you.

To get by, I ended up using a separate $v for each list item with a watch on $v.$invalid that emits to the parent. It's a little hacky but is working.

The approach you proposed would allow me to keep things consistent.
However, my data structure is fairly large so I'm a little concerned about repeatedly calling validations() when most of the tree has not changed. Maybe this is negligible? Maybe vuelidate is essentially doing this internally already? I'll have to test it out.

EDIT
after testing...
So validations() is not called as often as I expected. (I need to learn how computed properties figure out dependencies. It's kind of amazing.) While there is some wasted recreation of parts of the tree that are unrelated to what has changed, this way is much nicer than what I had originally.
EDIT

Thanks again.

[Frizi]

I need to learn how computed properties figure out dependencies. It's kind of amazing.

It still amazes me too. 😂

If you want a quick overview on it, I described it my vueconf talk. Have fun!