微信小程序 循环及嵌套循环的使用总结


Posted in Javascript onSeptember 26, 2017

微信小程序 循环及嵌套循环的使用总结

关于微信小程序,最近被安排做微信小程序,首次接触,总体来说上手不是太困难。

对于小程序的循环问题颇有感触,因为自己绑定数据到界面无数次用到循环和嵌套循环。

对于我们在js中从接口中通过POST或GET请求获取数据存放到Page中定义的对象中:

//首页话题列表 
   wx.request({ 
    url: 'https://*******************', 
    method: 'POST', 
    data: { 
     pageNum: 1, 
     pageSize: 10 
    }, 
    success:function(res){ 
     that.setData({ 
      listTop:res.data, 
       
     }) 
    } 
   })

在wxml文件中通过  

wx:for="{{listTop}}"

来实现循环输出对象中的数据,这里我们可以通过{{index }} 获取下标,也可以自定义下标:

wx:for-index="index2"

当listTop中存在对象com的时候,我们可以通过wx:for="{{item.com}}" 来实现循环该循环中的数据。

我在实际的项目中,遇到这样一个问题:在嵌套循环的过程中,我需要将某个字段的值进行转换,比如时间戳换成日期/几天前等,这个时候我们应该

知道微信小程序不支持界面直接调用JS,这个时候我们应该怎么解决:

起初自己饶了很大一个弯子,我总是想在JS中通过循环放到一个对象中,然后再在界面循环出来,其实前一步我已经接近结果了,但是实际开发中

自己作为刚入职不到一个月的新手还是有很多不足,所以自己陷入到死循环当中。

解决方案:在你遍历出来的时候,直接把原有的数据替换成想要的数据就行了。。。。(很简单,但是当局者迷,但是由于自己解决的,可能存在

更好的方法,这里仅作叙述)

for (var i = 0; i < res.data.data.length;i++){ 
    console.log(res.data.data[i].comments+"**********"+i)  
    
    console.log("***"+i) 
    if (res.data.data[i].comments !=null){ 
     for (var j = 0; j < res.data.data[i].comments.length;j++){ 
      res.data.data[i].comments[j].createTime=transDate(res.data.data[i].comments[j].createTime) 
     } 
    } 
     }

如有疑问请留言或者到本站社区交流讨论,感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

Javascript 相关文章推荐
js实现ASP分页函数 HTML分页函数
Sep 22 Javascript
JavaScript开发时的五个注意事项
Dec 08 Javascript
JavaScript 动态生成方法的例子
Jul 22 Javascript
兼容IE和Firefox的javascript获取iframe文档内容的函数
Aug 15 Javascript
jquery表单验证使用插件formValidator
Nov 10 Javascript
设为首页加入收藏兼容360/火狐/谷歌/IE等主流浏览器的代码
Mar 26 Javascript
深入解读JavaScript中的Hoisting机制
Aug 12 Javascript
Node.js操作Firebird数据库教程
Mar 04 Javascript
jQuery 开发之EasyUI 添加数据的实例
Sep 26 jQuery
layui button 按钮弹出提示窗口,确定才进行的方法
Sep 06 Javascript
vue-drawer-layout实现手势滑出菜单栏
Nov 19 Vue.js
jquery插件实现悬浮的菜单
Apr 24 jQuery
Node.js dgram模块实现UDP通信示例代码
Sep 26 #Javascript
深入理解ES6 Promise 扩展always方法
Sep 26 #Javascript
微信小程序开发之IOS和Android兼容的问题
Sep 26 #Javascript
Thinkphp5微信小程序获取用户信息接口的实例详解
Sep 26 #Javascript
微信小程序url与token设置详解
Sep 26 #Javascript
微信小程序之滚动视图容器的实现方法
Sep 26 #Javascript
微信小程序开发之好友列表字母列表跳转对应位置
Sep 26 #Javascript
You might like
MYSQL 小技巧 -- LAST_INSERT_ID
2009/11/24 PHP
PHP使用Redis实现Session共享的实现示例
2019/05/12 PHP
JavaScript 继承详解 第一篇
2009/08/30 Javascript
基于jquery的点击链接插入链接内容的代码
2012/07/31 Javascript
javascript中方便增删改cookie的一个类
2012/10/11 Javascript
JavaScript中prototype为对象添加属性的误区介绍
2013/10/15 Javascript
纯JavaScript基于notie.js插件实现消息提示特效
2016/01/18 Javascript
jquery 多个radio的click事件实例
2016/12/03 Javascript
AngularJS ng-repeat指令中使用track by子语句解决重复数据遍历错误问题
2017/01/21 Javascript
深入探究AngularJs之$scope对象(作用域)
2017/07/20 Javascript
jQuery解析json格式数据示例
2018/09/01 jQuery
Vuex的实战使用详解
2019/10/31 Javascript
原生JavaScript之es6中Class的用法分析
2020/02/23 Javascript
Javascript摸拟自由落体与上抛运动原理与实现方法详解
2020/04/08 Javascript
python socket 超时设置 errno 10054
2014/07/01 Python
Python中一些自然语言工具的使用的入门教程
2015/04/13 Python
详解Python的Django框架中的通用视图
2015/05/04 Python
python 限制函数调用次数的实例讲解
2018/04/21 Python
Python3.4学习笔记之类型判断,异常处理,终止程序操作小结
2019/03/01 Python
pyqt5之将textBrowser的内容写入txt文档的方法
2019/06/21 Python
Python中的相关分析correlation analysis的实现
2019/08/29 Python
Python 中的函数装饰器和闭包详解
2021/02/06 Python
收藏!10个免费高清视频素材网站!【设计、视频剪辑必备】
2021/03/18 杂记
Html5 实现微信分享及自定义内容的流程
2019/08/20 HTML / CSS
Dr. Martens马汀博士澳大利亚官网:马丁靴鼻祖
2019/07/02 全球购物
你们项目是如何进行变更控制的
2015/08/26 面试题
机电一体化自荐信
2013/12/10 职场文书
英语自荐信范文
2013/12/11 职场文书
2014小学植树节活动总结
2014/03/10 职场文书
幼儿园校园小喇叭广播稿
2014/10/17 职场文书
监理中标通知书
2015/04/16 职场文书
学生会副主席竞选稿
2015/11/19 职场文书
js之ajax文件上传
2021/05/13 Javascript
Python关于OS文件目录处理的实例分享
2021/05/23 Python
Python用any()函数检查字符串中的字母以及如何使用all()函数
2022/04/14 Python
Windows Server 2012 R2服务器安装与配置的完整步骤
2022/07/15 Servers