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


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 相关文章推荐
翻译整理的jQuery使用查询手册
Mar 07 Javascript
jquery 新手学习常见问题解决方法
Apr 18 Javascript
Iframe 自动适应页面的高度示例代码
Feb 26 Javascript
分享一款基于jQuery的视频播放插件
Oct 09 Javascript
关于编写性能高效的javascript事件的技术
Nov 28 Javascript
jquery使用animate方法实现控制元素移动
Mar 27 Javascript
深入理解Javascript中的作用域链和闭包
Apr 25 Javascript
JS实现留言板功能[楼层效果展示]
Dec 27 Javascript
JavaScript学习总结(一) ECMAScript、BOM、DOM(核心、浏览器对象模型与文档对象模型)
Jan 07 Javascript
vue el-table实现自定义表头
Dec 11 Javascript
js实现表单项的全选、反选及删除操作示例
Jun 05 Javascript
Javascript confirm多种使用方法解析
Sep 25 Javascript
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
抓取YAHOO股票报价的类
2009/05/15 PHP
服务器web工具 php环境下
2010/12/29 PHP
Yii 2中的load()和save()示例详解
2017/08/03 PHP
使用PHP反射机制来构造&quot;CREATE TABLE&quot;的sql语句
2019/03/21 PHP
清华大学出版的事半功倍系列 javascript全部源代码
2007/05/04 Javascript
jquery中获取元素的几种方式小结
2011/07/05 Javascript
js通过googleAIP翻译PHP系统的语言配置的实现代码
2011/10/17 Javascript
nodejs导出excel的方法
2015/06/30 NodeJs
基于javascript实现表格的简单操作
2016/05/21 Javascript
nodejs实例解析(输出hello world)
2017/01/03 NodeJs
jquery uploadify隐藏上传进度的实现方法
2017/02/06 Javascript
webpack实用小功能介绍
2018/01/02 Javascript
NW.js 简介与使用方法
2018/02/01 Javascript
vue轮播图插件vue-concise-slider的使用
2018/03/13 Javascript
jQuery中复合选择器简单用法示例
2018/03/31 jQuery
vue2.0 实现富文本编辑器功能
2019/05/26 Javascript
通过jQuery学习js类型判断的技巧
2019/05/27 jQuery
在Python操作时间和日期之asctime()方法的使用
2015/05/22 Python
python实现的系统实用log类实例
2015/06/30 Python
机器学习python实战之决策树
2017/11/01 Python
用Python登录好友QQ空间点赞的示例代码
2017/11/04 Python
Python3中条件控制、循环与函数的简易教程
2017/11/21 Python
在dataframe两列日期相减并且得到具体的月数实例
2018/07/03 Python
python 获取图片分辨率的方法
2019/01/08 Python
numpy基础教程之np.linalg
2019/02/12 Python
Python File(文件) 方法整理
2019/02/18 Python
简单了解Java Netty Reactor三种线程模型
2020/04/26 Python
python 双循环遍历list 变量判断代码
2020/05/04 Python
使用python批量修改XML文件中图像的depth值
2020/07/22 Python
CSS3实现10种Loading效果
2016/07/11 HTML / CSS
Marlies Dekkers内衣美国官方网上商店:高端内衣品牌
2018/11/12 全球购物
医学专业职业生涯规划范文
2014/02/05 职场文书
反腐倡廉警示教育活动总结
2014/05/05 职场文书
2014年教师节演讲稿
2014/09/03 职场文书
Python中的 Set 与 dict
2022/03/13 Python
vmware虚拟机打不开vmx文件怎么办 ?vmware虚拟机vmx文件打开方法
2022/04/08 数码科技