The problem with the vue cycle?

I have a question to ask the boss
scenario: I want v-for to cycle through a data, which is obtained through the interface, but I want to use this sub-item to check the data interface to get another array and cycle out a new list under this sub-item. What good solutions do bosses have for this situation
sample code:
< div v-for="item of items" >

    

<ul> item.namesubitems <li v-for="subitem of subitems"></li> </ul>

</div>
Feb.24,2022

I really don't agree with this structure, so several item requests subitems several times. As answered by the first floor, it takes time to pull the data again, so as to save resources.
of course, if you don't want to click and pull, it's not impossible to render subitems when you want to render with item.
the idea goes something like this:

let items = await getItemsData();
let subitems = {};
for(let i=0;i<items.length;iPP){
    let name = items.name;
    subitems[name] = await getSubItemsData(name);
}
<div v-for='item of items'>
    

<ul> item.namesubitems <li v-for='subitem of subitems[item.name]'></li> </ul>

</div>

can be made into a drop-down style. Click the drop-down to get the data

Menu