商城小程序列表渲染
2018-10-15
導讀：wx:for 在組件上使用wx:for控制屬性綁定一個數(shù)組，即可使用數(shù)組中各項的數(shù)據(jù)重復渲染該組件。 默認數(shù)組的當前項的下標變量名默認為index，數(shù)組當前項的變量名默認為item view wx:for={{i...
wx:for
在組件上使用wx:for控制屬性綁定一個數(shù)組，即可使用數(shù)組中各項的數(shù)據(jù)重復渲染該組件。
默認數(shù)組的當前項的下標變量名默認為index，數(shù)組當前項的變量名默認為item
<view wx:for="{{items}}">
{{index}}: {{item.message}}
</view>
Page({
items: [{
message: 'foo',
},{
message: 'bar'
}]
})
使用wx:for-item可以指定數(shù)組當前元素的變量名
使用wx:for-index可以指定數(shù)組當前下標的變量名：
<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>
block wx:for
類似block wx:if，也可以將wx:for用在<block/>標簽上，以渲染一個包含多節(jié)點的結構塊。例如：
<block wx:for="{{[1, 2, 3]}}">
<view> {{index}}: </view>
<view> {{item}} </view>
</block
第二部分：如何開通一個小商店
上一篇：小程序代理商這么能賺錢為什么
下一篇：微信小程序登錄不上，怎么解決
- 關注官方公眾號 -
咨詢電話：4006-089-731