V-for to work with nested arrays where the component renders as much as the length of the parent array

Viewed 21

I have a nested array of objects and the structure is as follows:

selectedSystems = [[{name: 'James', systemID: 1}], [{name: 'John', systemID: 2}, {name: 'Emily', systemID: 3}], [{name: 'Rachel', systemID: 5}]]

What I am trying to achieve is display the names in as many boxes as the size of the parent array (selectedSystems) So Box1 will have just James, box 2 has John and emily and then box 3 has Rachel and for v-model I am using the index of the selectedSystem inside the child element. so selectedSystem[0] is the v-model for the first box as it contains . I get the no key passed error for v-for Any other way to do this/ make it simpler would be more appreciated.

can someone help me solve this problem?

0 Answers
Related