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. JavaEE笔记(七)

    Struts获取如何获取请求响应和回话 //获取HttpServletRequest HttpServletRequest request = ServletActionContext.getRequ ...

  2. 关于manacher

    由一个题引入: 求一个串A的最长回文串: A=abababa最长回文串长度:5(ababa) 先思考用hash怎么做? 一.暴力 枚举左端,右端点(确定一个区间),线性扫一遍当前区间. Ans=max ...

  3. 17-[JavaScript]- 内置对象 Array,String,Date,Math

    1.Array数组 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> < ...

  4. BootStap学习笔记(1)

    移动设备优先:  为了让开发的网站对移动设备友好,确保适当的绘制和触屏缩放,需要在网页的head之中添加viewport meat标签:如下: <metaname="viewport& ...

  5. 【总结】浅谈ref与out

    ref——仅仅是一个地址 (1)当一个方法或函数在使用ref作为参数时,在方法中或函数中对ref参数所做的更改都将反映在该变量中. (2)如果要使用ref参数,则必须将参数作为ref显示传递到方法中. ...

  6. Unity3D — — UGUI之RectTransform

    Mask.GetComponent<RectTransform>().anchoredPosition(子物体) = hotKey_image.rectTransform.anchored ...

  7. redis-4.0.2

    redis-4.0.2.tar.gz 链接:https://pan.baidu.com/s/1qj4bSgM1s2InLikugRNqKA 提取码:tozq 复制这段内容后打开百度网盘手机App,操作 ...

  8. 帝国后端php通用Api接口

    先来看一下api数据接口和那些小程序之间的关系,如下面的描述,百度小程序,微信小程序,轻应用,app像这些我们都称为终端小应用.api提供数据:会为各终端小应用提供统一的数据格式.客户小应用,从api ...

  9. django(新增model)No migrations to apply.

    django 1.8版本,在models下新建一个class,无法在数据库创建新表的问题: - models.py class HostPwd(models.Model): hostname = mo ...

  10. 工程能力之C4模型

    概述 刚在InfoQ上看到一篇介绍C4Model的文章,觉得这个模型设计的很赞,很有指导意义,做个简单的记录. Why,为什么需要架构图? ThoughtWorks中国 文章中有几句话我觉得很有道理, ...