列表渲染
支持指定索引和当前项名称,
for="p,index in persons"
或for="(p,index) in persons"
均可<view><view for="(item, index) in list"></view></view>
<view><view for="item, index in list"></view></view>
支持以数字作为取值范围
<!-- 遍历出的结果是 1 2 3 4 5-->
<view for="item in 5">{{item}}</view>
遍历对象
- 仅指定对象的属性值
-
<view for="value,key in obj"></view>
支持使用
of
替代in
作为分隔符<view for="item of obj">{{item}}</view>
<!-- 相当于 -->
<view for="item in obj">{{item}}</view>
block
是虚拟标签,可以用 for
来循环渲染一组组件或者标签。
<block for="item, index in list"> <span>A</span> <span>B</span> </block>
for 和 if 共存
支持在同一个标签中使用for
和,在if
的属性值中可以获取for
的索引或当前项变量。如下:
<view if="list.length">
<view for="item,index in list">hello:{item}</view>
</view>
区别于上述的 for
和 if
共存。 for
和 else/elif/else-if
共存时,else/elif/else-if
的优先级高于 for
。
原因是,else/elif/else-if
必须紧跟在 if/else-if/elif
分支后,在for
循环中重复 else
无意义且会导致解析错误。在for
循环中重复 elif/else-if
容易导致错误或者难以理解。以下是正确的使用方式
<view elif="conditionB" for="item,index in listA">hello B! {{item}}</view>
<view else for="item,index in listB">hello B! {{item}}</view>
!> for
和 if
和 else
三者并存时,请不要 使用 for if
并存写法,因为 并存 for
优先级高, 这种情况下会报错,请使用 block
标签自行包裹一层
嵌套的 for
允许嵌套使用,索引名和当前项变量名可以相同(但是从质量和可读性角度不建议这样命名)
<!-- good -->
<view for="(menu, index) in list">
<view for="(item, itemIndex) in menu">
{{itemIndex}} : {{item}}
</view>
</view>
<!-- bad -->
<view for="(item, index) in list">
<view for="(item, index) in item">
{{index}} : {{item}}
</view>
关于数组数据操作,参考。