2021-07-31 v-for实现多层嵌套遍历(二维数组的遍历)以及遍历数组与对象的用法

最新推荐文章于 2025-03-12 08:00:00 发布

原创

最新推荐文章于 2025-03-12 08:00:00 发布 · 4.2k 阅读

19 ·

CC 4.0 BY-SA版权

文章标签：

#vue

本文详细介绍了如何使用 Vue 的 v-for 指令进行多层嵌套遍历，包括二维数组的遍历方法，并提供了具体的代码示例及运行结果展示。此外，还探讨了v-for遍历数组和对象的不同用法，通过代码实例阐述了遍历过程。

1.v-for实现多层嵌套遍历

代码

<div id="app">
    <div v-for="(item,index) in person">
        我叫{
  
  {item.name}},我每天上午:
        <!-- 注:item.daily是把item取出来给第二层用 -->
        <div v-for="(items,indexs) in item.daily">
            {
  
  {items.am}}
        </div>
    </div>
</div>
<script>