请问怎么用v-for循环遍历一个json数组得到一个多行多列的列表

Question

遍历出像这样的一个多行多列的列表。。 每行最多三列。。每行第一个有属于其的classa,第二个有classb,第三个有classc..

Answer 1

<template>
    <div v-for="i in item">
        <p>{{ i.name }}</p>
        <div v-for="j in i.child">
            <p> {{ j.childName }}</p>
        </div>
    </div>
</template>

<script>
export default{
    data(){
        return{
            item:[
                {
                    name:'name',
                    child:[
                        {childName:'childName'}
                    ],
                }
            ]
        }
    }
}
</script>

我发现我好像答错了，不过这种布局的话可以用flex，限制每行3个就ok了。

Answer 2

这类布局类问题，尽量用 css来控制就可以了，

Answer 3

多行多列是你的布局问题，这个和vue没关系，你只要循环出json中的数据，按照你想要的dom结构评出来就行了，至于v-for的语法，自己可以去官网看看