微信小程式(4)wx:for迴圈
阿新 • • 發佈:2018-11-28
wx:for
在元件上使用 wx:for
控制屬性繫結一個數組,即可使用陣列中各項的資料重複渲染該元件。
預設陣列的當前項的下標變數名預設為 index
,陣列當前項的變數名預設為 item
<view wx:for="{{array}}">
{{index}}: {{item.message}}
</view>
使用 wx:for-item
可以指定陣列當前元素的變數名,
使用 wx:for-index
可以指定陣列當前下標的變數名:
<view wx:for="{{array}}" wx:for-index="idx" wx:for-item="itemName"> {{idx}}: {{itemName.message}} </view>
wx:for
也可以巢狀,下邊是一個九九乘法表
<view wx:for="{{[1, 2, 3, 4, 5, 6, 7, 8, 9]}}" wx:for-item="i">
<view wx:for="{{[1, 2, 3, 4, 5, 6, 7, 8, 9]}}" wx:for-item="j">
<view wx:if="{{i <= j}}">
{{i}} * {{j}} = {{i * j}}
</view>
</view>
</view>