首页 > 微信 > 详细

微信小程序 wx:for循环

时间:2021-09-11 19:05:20      阅读:21      评论:0      收藏:0      [点我收藏+]

循环数组:

  1. 一般数组:[1, 2, 3, 4, 5, ‘a‘, ‘m‘]

  2. 包含对象的数组:[ { key: value, ... }, { key: value, ...}]

  注: 一般数组中可以使用wx:key=‘*this’, 复杂数组使用wx:key=‘对象中唯一的属性’

<view>
  <view wx:for="{{test}}" wx:for-item=‘item‘ wx:for-index="index" wx:key=‘id‘>
    {{item.name}}
    --
    {{item.age}}
  </view>

  <view wx:for="{{list}}" wx:for-item=‘item‘ wx:for-index="index" wx:key=‘*this‘>
    {{item}}
  </view>
</view>

循环对象:

  对象数据:{key: value, ...}

  注:wx:key等于一个对象中的属性,且该属性唯一即可

<!-- 对象循环 -->
<view>
  <view wx:for="{{shopping}}" wx:for-item=‘value‘ wx:for-index="key" wx:key=‘food‘>
    {{key}}
    --
    {{value}}
  </view>
</view>

 

补充小知识:

  block标签:占位标签,编写时使用block,在页面渲染时,block标签会自动被小程序移除,只保留其内部内容

<!-- block标签 -->
<view>
  <block wx:for="{{test}}" wx:key=‘id‘>
    {{item.name}}
    ---
    {{item.age}}
  </block>
</view>

 

微信小程序 wx:for循环

原文:https://www.cnblogs.com/leafchen/p/15251736.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!