html自定义列表第三层嵌套,【微信小程序】关于微信小程序多层嵌套渲染列表以及嵌套列表中数据的获取...
起因:意图是想实现类似于安卓viewpager那样的效果,想到了用微信小程序的swiper组件,但如果每个swiper-item里都只用一个wx:for来渲染数据的话实在是太慢了,就想到多层嵌套数据渲染来提高效率。
直接上代码
wxml:
----{{item.name}}----
----{{two.name}}----
----{{three.name}}----
-------------------------------------------
js
one: [{
id: 1,
name:'第一层',
two: [{
'id': 11,
'name': '第二层第一个数据'
}, {
'id': 12,
'name': '第二层第二个数据'
}],
three: [{
'name': '第三层数据'
}]
},
{
id: 2,
name: '第二次渲染第一层',
two: [{
'id': 13,
'name': '第二层第一个数据2'
}, {
'id': 14,
'name': '第二层第二个数据2'
}],
three: [{
'name': '第三层数据'
}]
},
{
id: 3,
name: '第三次渲染第一层',
two: [{
'id': 15,
'name': '第二层第一个数据3'
}, {
'id': 16,
'name': '第二层第二个数据3'
}],
three: [{
'name': '第三层数据'
}]
}
]
实现效果图:
如果你想取其中一个数组的某个字段的值,可以用以下写法:
var twodata = this.data.one[0].two
var text = twodata[1].name
console.log(text)
html自定义列表第三层嵌套,【微信小程序】关于微信小程序多层嵌套渲染列表以及嵌套列表中数据的获取...相关推荐
- 【小破站下载工具】Python tkinter 实现网站下载工具,所有数据一键获取
目录 前言 开发环境 本次项目案例步骤 先展示下完成品的效果 界面 导入模块 先创建个窗口 功能按键 主要功能代码编写 功能一 功能二 功能三 前言 最近很多同学想问我,怎么把几个代码的功能集合到一起 ...
- PHP之 “微信走步数据” ,获取并解密处理的实践操作(关键代码)
应用场景 在微信小程序的开发中,我们经常需要从微信端获取一些处理,以方便我们的程序操作处理,如"从微信端获取走步数据","从微信端获取手机号"等,而这些数据,考 ...
- 微信小程序手把手教你实现带字母索引的城市选择列表
微信小程序手把手教你实现带字母索引的城市选择列表 前言 需求分析 左边可滑动列表 滑动列表UI实现 item点击事件 右边带字母的索引条 索引条从上到下分别是定位和26个大写字母 索引条响应触摸和点击 ...
- 微信小程序原生接入腾讯云im(单聊,列表,聊天界面,自定义消息,自动回复)
微信小程序原生接入腾讯云im(单聊,列表,聊天界面,自定义消息,自动回复) 发送图片语音消息传送→ 文章目录 1.项目需求 2.参考文档 3.效果图 4.初始化 集成SDK 5.登录 6.会话列表 7 ...
- 微信小程序:微信也可以发闪照了闪照制作生成微信小程序源码下载,自定义闪照时间
这是一款闪照制作的一款微信小程序源码 该源码呢也就是让用户在微信也可以实现QQ上面的闪照功能 用户可以自主上传照片,可以自定义的选择闪照的时间 另外这款小程序还支持流量主模式 这种东西目前在微信还是挺 ...
- Android微信小尾巴,微信骚操作,微信聊天小尾巴这样自定义设置,安卓苹果都支持...
原标题:微信骚操作,微信聊天小尾巴这样自定义设置,安卓苹果都支持 前段时间,在大家"拍一拍"玩得不亦乐乎的时候,有小伙伴问我微信聊天的小尾巴怎么实现? 当时,给我发来一张效果图,当 ...
- android 自定义Scrollview实现淘宝二层楼效果新版微信小程序下拉效果
android 自定义Scrollview实现淘宝二层楼效果新版微信小程序下拉效果 由于最近一段时间真的是太忙了,没有顾上即使更新博客,还请粉丝们见谅,最近要实现这样一个效果,这个效果跟淘宝二层楼和新 ...
- Android仿微信首页下拉显示小程序列表
花点时间重新熟悉一下AndroidUI方面的东西,把古董PullToRefreshView又撸了一遍,技术这种东西真是忘得快啊...在基础上新增一点东西,粗糙地实现了仿微信首页下拉显示小程序列表的样式 ...
- android微信下拉出现小程序,Android仿微信首页下拉显示小程序列表
花点时间重新熟悉一下AndroidUI方面的东西,把古董PullToRefreshView又撸了一遍,技术这种东西真是忘得快啊...在基础上新增一点东西,粗糙地实现了仿微信首页下拉显示小程序列表的样式 ...
最新文章
- RDKit | 基于scikit-learn将pytorch用于QSAR模型构建
- linux ping程序设计与实现,一步步学Linux网络编程--ping命令的实现分析
- [case12]演进式架构
- Netdata---Linux系统性能实时监控平台部署记录
- 华为MSTP配置教程(二)
- 从键盘输入一串连续的数字,判断输出是否为电话号码
- OpenStack Nova计算服务管理(四)
- MTK 驱动(58)---MTK G-sensor
- Vhost and VIOMMU
- cvsaveimage 异常_C++ IplImage*的若干bug之三:cvSaveImage問題
- 再看《JavaScript高级程序设计》第8-9章
- Coverity 配置coverity扫描python静态代码检测
- 【Oracle】交差并补
- 有效沟通bic法则_有效沟通的五个法则
- git提交错分支怎么办
- 账套恢复失败 文件服务器,用友T3恢复账套时提示:备份信息文件无效,恢复失败?...
- 无限火力跳跳机器人_英雄联盟无限火力小拳拳升降机蒸汽机器人
- HDU5619 Jam's store(最小费用最大流 MCMF)
- nginx-rtmp 的部署
- Vivado使用技巧(17):创建IBIS模型
热门文章
- PHP中处理函数的函数(Function Handling Functions)
- Go语言 - 忍不了了!!!已将Go语言各标准包文档.移到自己服务器上
- DELL台式机BIOS常见问题
- MyEclipse优化浅析
- 机器学习实战:TypeError: unhashable type: 'matrix'
- Kafka 客户端实现逻辑分析
- Android 创建其它应该程序的上下文对象
- JavaScript prototype 属性
- Kafka、RabbitMQ、RocketMQ等消息中间件的对比 —— 消息发送性能和区别
- 反思项目调试整体过程