小程序-for循环

Posted 2020-08-28 司马懿FE技术分享

微信小程序的在wxml的for循环和angularjs的循环方式相差不多，格式为：<view wx:for="循环体">{{index}}     {{list}} </view> 这里的list是循环体里的数据的固定名称,index为循环数据的索引值即下标值的固定名称

如果是嵌套循环，很容易出现多个list和index，所以在小程序中可以重命名 list 和index  方法为：wx:for-index=\'重命名\' wx:for-list="重命名"

例子如下：

wxml:

<view>
<!--改变item（value），index名字-->
改变名称：
<text class=\'{{classname}}\' wx:for="{{arr}}" wx:for-index="key" wx:for-item="value">{{key}}--{{value}}</text>
</view>

wxjs:

 data: {
 arr:[\'arr1\',\'arr2\',\'arr3\']
  }

　　显示结果为：