在 外层循环中使用 wx:for 进行列表渲染,可以使用 wx:for-index 绑定索引值,例如: wx:for-index="dataListindex"。
在 内层循环中设置一个 wx:for-item 属性,例如: wx:for-item="cell",这样可以将内层循环的每一个数据项重新命名为 cell。
在 内部循环中,使用 {{cell.属性}} 可以访问 cell 对象的属性,例如: {{cell.name}}。
如下例子,其中外层循环使用 wx:for="{{arrange_time}}" 进行列表渲染,内层循环使用 wx:for="{{list_sheduled}}" wx:for-item="cell" 进行列表渲染,然后就可以使用 {{cell.属性}} 访问内层循环的数据项了。
<!-- 外层循环,对arrange_time进行循环,如下放注解展示,相当于要执行两次循环 -->
<view class="itemBox" wx:for="{{arrange_time}}" wx:for-index="dataListindex" wx:key="index">
<!-- 展示外层循环的数据 -->
<view class="timeBox">{{item}}</view>
<!-- 进行内层循环 -->
<view wx:for="{{list_sheduled}}" wx:for-item="cell" wx:key="index">
<!-- 进行判断:如果外层的item与内层的arrange_time相同,就输出内层的id -->
<view class="timeBox" wx:if="{{item==cell.arrange_time}}">{{cell.id}}</view>
</view>
</view>
注解:
arrange_time是个一维数组,在引用时直接可以使用item,不需要.属性
list_sheduled是个数组对象,引用数据需要.属性,这里由于使用了wx:for-item="cell",则内层循环在引用数据的时候,需要使用cell而不是item,例如cell.arrange_time,cell.main_status等
效果:
方法2:
例子来源于 developers.weixin.qq.com,其中第一重循环中使用 wx:for-index="cat_idx" 绑定索引值,第二层循环中使用 wx:if="{{post.cid == categoriesList[cat_idx].id}}" 判断条件:
<block wx:for="{{categoriesList}}" wx:key="{{index}}" wx:for-index="cat_idx">
<view class="category-title">{{item.cat}}</view>
<view class="post-list">
<block wx:for="{{postList}}" wx:key="{{index}}" wx:if="{{post.cid == categoriesList[cat_idx].id}}">
<view class="post-item">
<view class="post-title">{{post.title}}</view>
<view class="post-desc">{{post.desc}}</view>
</view>
</block>
</view>
</block>
可以通过使用 wx:for-item 和 {{cell.属性}} 访问内层循环的数据项,或者使用 wx:if 判断条件,实现微信小程序前端嵌套循环值的比较。