wx:for="{{list}}"用来循环数组,而list即为数组名wx:for-item="items" 即用来定义一个循环过程中每个元素的变量的

如果是一维数组,按照如下方式循环出来:

<view wx:for="{{list}}">

  {{index}} {{item.name}}

</view>

以上代码中,item即为list的别名。

如果是二维甚至多维数组,按照如下方式循环:

<view wx:for="{{parentList}}">

  {{item.id}}

  <view wx:for="{{item.childList}}" wx:for-item="items">

    {{items.name}}{{item.account}}

  </view>

</view>

for (var i = 0 ; i < list.length; i++) {

  var xxx = list[i];

}

等同于

<view wx:for="{{list}}" wx:for-item="xxx"></view>

谨记:wx:for是循环数组,wx:for-item即给列表赋别名

以下为几个错误使用,请大家谨慎使用:

1.直接用wx:for-item ,这样是循环不出来列表的

<view wx:for-item="{{list}}">

    {{index}} {{item.name}}

</view>

2.子循环中慎用wx:for-item

<view wx:for="{{parentList}}">

      {{item.id}}

  <view wx:for-item="{{item.childList}}" wx:for-item="items">

      {{items.name}}{{items.account}}

  </view>

</view>

微信小程序wx:for和wx:for-item的正确用法的更多相关文章

  1. 微信小程序数据请求方法wx.request小测试

    微信小程序数据请求方法 wx.request wxml文件: <view> <textarea value="{{textdata}}"/> </vi ...

  2. 微信小程序wepy开发循环wx:for需要注意

    微信小程序wepy开发循环wx:for需要注意 item index值必须在wx:for之后使用 <view wx:for="{{tablist}}" class=" ...

  3. 微信小程序-用户拒绝授权使用 wx.openSetting({}) 重新调起授权用户信息

    场景模拟:用户进入微信小程序-程序调出授权 选择拒绝之后,需要用到用户授权才能正常使用的页面,就无法正常使用了. 解决方法:在用户选择拒绝之后,弹窗提示用户 拒绝授权之后无法使用,让用户重新授权(微信 ...

  4. 微信小程序如何在使用wx.request使用cookie

    我主要是做asp.net mvc后端开发的,经常使用Jquery的ajax与后台的Web API进行数据交互. 最近公司要做一个小程序,要实现小程序与Web前端的通信,当然小程序是可以实现socket ...

  5. 微信小程序的坑之wx.miniProgram.postMessage

    工作中有个需求是小程序的网页在关闭的时候,需要回传给小程序一个参数 查阅小程序官方文档,有这样一个接口 wx.miniProgram.postMessage ,可以用来从网页向小程序发送消息,然后通过 ...

  6. 微信小程序组件——详解wx:if elif else的用法

    背景 在学习微信小程序开发wxml页面时,需要使用if,else来判断组件是否进行展示,代码如下 <view wx:if="{{is_login==1}}">成功登录& ...

  7. 微信小程序踩坑之一[wx.request]请求模式

    最近在做小程序时,使用wx.request()方法请求时, 当使传输string类型时,一定要声明method请求模式为post,否则会一直报错,而不声明时默认为get, 已填坑 =,= wx.req ...

  8. 微信小程序节点查询方法:wx.createSelectorQuery()的使用场景与注意事项

    小程序由于内置于微信,这使得它有了得天独厚的宣传和使用优势,本着学习的心态,我在官网上看了一遍开发文档,大致得出小程序框架的设计模式与使用注意事项(重点来了,其实开发文档某些方面叙述的并不仔细,甚至存 ...

  9. 微信小程序---人脸识别(wx.startFacialRecognitionVerify)

    1.由于人脸核验功能涉及到用户的敏感.隐私信息,因此调用此接口的业务方,需要满足一定的条件,申请小程序的人脸识别api.开通小程序后台的接口权限入口后,开发者可以登录mp.weixin.qq.com小 ...

  10. 微信小程序(mpvue) wx.openSetting 无法调起设置页面

    在开发过程有个需要保存图片/视频到设备相册的业务,so easy~   巴啦啦撸下来了完整功能, wx.saveVideoToPhotosAlbum 会自动调起用户授权,美滋滋~~   btu.... ...

随机推荐

  1. WPF DatePicker 添加水印效果

    这个控件没有水印属性,依然使用依赖属性解决 public class DatePickerHelper { public static object GetWatermark(DependencyOb ...

  2. comet 推送消息到客户端

    weiconfig: <system.web> <httpHandlers> <add path="comet_broadcast.ashx" typ ...

  3. codeforces 914 D 线段树+数学

    题意 给出一个长度为\(n\)的数列\(a\),两种询问,第一种给出三个数\(l,r,x\),区间\([l,r]\)的\(gcd\)值是否和\(x\)相似,若最多改变区间\([l,r]\)中的一个数使 ...

  4. Storm 第三章 Storm编程案例及Stream Grouping详解

    1 功能说明 设计一个topology,来实现对文档里面的单词出现的频率进行统计.整个topology分为三个部分: SentenceSpout:数据源,在已知的英文句子中,随机发送一条句子出去. S ...

  5. Python浮点算术:争议和限制

    浮点数在计算机硬件中表示为以 2 为基数(二进制)的小数.举例而言,十进制的小数 0.125 等于 1/10 + 2/100 + 5/1000 ,同理,二进制的小数 0.001 等于0/2 + 0/4 ...

  6. 解决Ubuntu“下载额外数据文件失败 ttf-mscorefonts-installer”的问题 (转载)

    解决Ubuntu“下载额外数据文件失败 ttf-mscorefonts-installer”的问题 发表于 2017-09-15 | 更新于 2018-04-29 | 分类于 Linux | 评论数: ...

  7. 解决k8s出现pod服务一直处于ContainerCreating状态的问题的过程

    参考于: https://blog.csdn.net/learner198461/article/details/78036854 https://liyang.pro/solve-k8s-pod-c ...

  8. (转)Django配置数据库读写分离

    转:https://blog.csdn.net/Ayhan_huang/article/details/78784486 转:http://www.cnblogs.com/dreamer-fish/p ...

  9. Daily Scrum (2015/10/26)

    今晚由于我们组成员就团队Week5作业的个人贡献分开会协商,所以把今天的编码工作往后延迟了.考虑到有些成员代码还没理解够,正好TFS的代码阅读分配的工作时间还没进行完,所以在会议之后我们让成员回寝自由 ...

  10. 【Alpha】阶段第七次Scrum Meeting

    [Alpha]阶段第七次Scrum Meeting 工作情况 团队成员 今日已完成任务 明日待完成任务 刘峻辰 增加上课信息接口 编写按学院搜索课程接口 赵智源 构建后测试点测试框架 构建前测试点测试 ...