[Vuejs]-Vue Array in Array

0๐Ÿ‘

โœ…

you can try using for loop to iterate the items such as:

var content = new Vue({
    el: '#content',
    data: {
        items: data
    }
});

<div class="short" v-for="item in items">
    <div class="top">
        <img :src="item.userAvatar" />
        {{ item.userName }}
    </div>
    <div class="bottom">
        <div v-for="(i, idx) in item.items" :key="idx">{{ i.name }} {{ i.type }}</div>
    </div>
</div>

0๐Ÿ‘

Your image shows the userAvatar and userName are members of the Array object, and not members of each item in the Array. That is, there is one userName for the entire Array. You would refer to it as items.userName.

Leave a comment