获取了 N 条信息(具体有多少条不确定),如何在界面中动态呈现出来呢?

.wxml 代码

<view wx:for="{{items}}" wx:for-index="index" wx:for-item="item">
{{index+1}}、{{item.title}}
</view>

核心代码就是 wx:for,对应一个数组。

而 wx:for-index 指明后面如果要用数组索引的话,           用什么名字,如果名字是 index,则可省略,直接使用。

而 wx:for-item  指明后面如果要用数组索引对应的项的话,用什么名字,如果名字是 item,则可省略,直接使用。

.js 代码

Page({

data: {
    items: [
        {
            "url":"http://127.0.0.1/1.flv",
            "title":"这是标题一"
        },
        {
            "url":"http://127.0.0.1/2.flv",
            "title":"这是标题二"
        }
    ]
}

})

微信小程序-wx:for 循环列表的更多相关文章

  1. 微信小程序实现给循环列表点击添加类(单项和多项)

    在微信小程序里面没有DOM对象, 不能操作DOM. 所有的操作通过数据来实现,下面主要实现了给循环列表点击添加类的操作 一.单项 目标需求:实现下图,给点击的view增加类,每次只能选择一个. 主要思 ...

  2. 微信小程序实现给循环列表添加点击样式实例

    微信小程序有个属性hover-class='active',是指当点击列表元素时当按下鼠标左键会显示active样式,但是鼠标离开样式就会复原.可以参考以下解决方案,直接上代码: wxml: ? 1 ...

  3. 微信小程序wx:for循环

    最近做微信小程序碰到了一些问题,和wx:for循环相关,wx:for有很多用途,例如可以用于swiper中图片的循环,也就是所谓的轮播图,也可以用于其它的循环,可以大大地减少代码量. 但wx:for. ...

  4. 小程序wx:for循环列表数量的限制

    数据有100条,我们只要页面显示一部分,就要通过index来限制.index<3,就是显示序列0,1,2这三条数据.具体写法: <block wx:for='{{list}}' wx:ke ...

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

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

  6. 微信小程序编写新闻阅读列表

    微信小程序编写新闻阅读列表 不忘初心,方得始终:初心易得,始终难守. 本篇学习主要内容 Swiper 组件(轮播图) App.json 里的关于导航栏.标题的配置. Page 页面与应用程序的生命周期 ...

  7. 微信小程序wx.request接口

    微信小程序wx.request接口 wx.request是小程序客户端与服务器端交互的接口 HTTPS 请求 一个微信小程序,只能同时(同时不能大于5个)有5个网络请求 wx.request(OBJE ...

  8. 监控微信小程序wx.request请求失败

    在微信小程序里,与后台服务器交互的主要接口函数是wx.request(),用于发起 HTTPS 网络请求.其重要性不言而喻.然而,却经常遇到请求失败的问题,笔者特意谷歌"wx.request ...

  9. 微信小程序wx.showActionSheet调用客服信息功能

    微信小程序wx.showActionSheet调用客服消息功能 官方文档的代码: wx.showActionSheet({ itemList: ['A', 'B', 'C'], success (re ...

  10. 微信小程序之for循环

    在微信小程序中也有for循环,用于进行列表渲染. 官方实例 打开微信开发者文档,在框架部分的视图层-->wxml-->列表渲染中可以看到官方给出的for循环实例,在实例中 可以看到下面相关 ...

随机推荐

  1. Spring MVC 中急速集成 Shiro 实践

    相信有很多的程序员,不愿意进行用户管理这块代码实现. 原因之一,不同的JavaEE 系统,用户管理都会有个性化的实现,逻辑很繁琐. 而且是系统门面,以后背锅的几率非常大,可谓是低收益高风险. 最近在系 ...

  2. 虚拟机安装VBoxAdditions增强功能

    在VirtualBox上安装好CentOS后,需将VBoxAdditions增强功能安装上,该功能有如下作用: (1)实现客户机和主机间的鼠标平滑移动 (2)与主机实现文件共享 (3)安装虚拟显卡驱动 ...

  3. Android玩转百度地图Sha1获取正确姿势?

    场景一 由于近期项目钟要用到定位功能因此肯定须要用到地图以及地位功能,相信大家也知道眼下国内比較出名的地图像百度.高德.腾讯等这些还是用到比較多的.于是思考了一下决定还是用百度,相信老司机们都知道的哈 ...

  4. 〖Android〗屏幕触屏事件录制与回放

    需求: 不管是做自动化测试的,还是传媒技术的,自动化操作Android App是一种操作需求: 自动化的操作可以节省很多的人力资源投入: 实现: Android UI界面的自动化,通常有两个方法: 1 ...

  5. python之模块hashlib(提供了常见的摘要算法,如MD5,SHA1等等)

    # -*- coding: utf-8 -*- #python 27 #xiaodeng #python之模块hashlib(提供了常见的摘要算法,如MD5,SHA1等等) #http://www.c ...

  6. 【centos6】安装redis + phpredis 以及 常用配置参数

    1.redis-server和redis-cli安装文章:http://www.cnblogs.com/skyessay/p/6429988.html 1.前置条件:查看是否安装gcc,命令:gcc ...

  7. tensorflow内存溢出问题

    Tensorflow的静态图结构简洁清晰,符合人的思维.虽然编程上略微有些复杂,但是原理很容易看懂. Tensorflow分建图过程和运行图(张量求值)两个阶段,在这两个阶段中都可以定义操作和张量.但 ...

  8. 命令行参数解析函数getopt和getopt_long函数【转】

    原文地址:http://blog.csdn.net/cashey1991/article/details/7942809 getopt和getopt_long函数   平时在写程序时常常需要对命令行参 ...

  9. 【转】expect语言学习笔记

       上周mentor要求我写一个unix shell 脚本, 以便半夜让服务器自动编译image. 其实我觉得每天我走的时候让服务器编译不也挺好的么... 我懒,假装没听见好不容易赖过去了.     ...

  10. HDU 2067 小兔的棋盘 (卡特兰数)

    小兔的棋盘 Time Limit: 1000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total Submi ...