微信小程序循环数据
来源:互联网 发布:windows ntp配置 编辑:程序博客网 时间:2024/05/18 00:59
/** * 生命周期函数--监听页面加载 */ onLoad: function (options) { var content_for=[ { date: "2020年 10月 9日 ", title: "那年夏天", header_url:"/images/3.png", image_url: "/images/6.jpg", content: "天不言自高,地不言自厚,奇迹,是不会在容易的道路上绽放的。人生没有如果,只有后果和结果,过去的不再回来,回来的不再完美。", }, { date: "2022年 10月 9日 ", title: "夏天", header_url: "/images/3.png", image_url: "/images/8.jpg", content: "人生没有如果,只有后果和结果,过去的不再回来,回来的不再完美。", }, ] this.setData({ key: content_for }); },
- 每个for循环都要用block标签包括
- wx:for-item=”item” 默认有可无
- wx:for-index=”idx”循环下标值 0,1,2
<block wx:for="{{key}}" wx:for-item="item" wx:for-index="idx"> <view class="content"> <!-- 头像 --> <view class="author-date"> <image src="{{item.header_url}}" class="author"></image> <text class="date">{{item.date}}{{idx}}</text> </view> <!-- 标题内容 --> <text class="title">{{item.title}}</text> <image class="image" src="{{item.image_url}}"></image> <text class="article-content">{{item.content}}</text> <view > <image class="article-images" src="../../images/icon/chat.png"></image> <text class="article-text">66</text> <image class="article-images" src="../../images/icon/view.png"></image> <text class="article-text">88</text> </view> </view> </block>
不要试图给自己找任何借口,错误面前没人爱听那些借口。
阅读全文
0 0
- 微信小程序循环数据
- 微信小程序 数据绑定 条件循环
- 微信小程序开发之数据使用wx:for循环展示
- 微信小程序-跟随菜单(楼梯效果)和循环嵌套加载数据
- 微信小程序循环赋值坑
- 微信小程序wx:for循环
- 微信小程序循环请求api
- 微信小程序循环:Wx:for
- 微信小程序开发阅读&电影小程序之(3)——新闻列表页面构建-数据绑定-for循环
- 程序循环
- 微信小程序-页面FOR循环和嵌套循环
- 关于微信小程序循环以及嵌套循环的总结
- 微信小程序---for循环使用以及循环中的内容获取
- 微信小程序 wx:key 高级列表循环
- 微信小程序-wx:for 循环列表
- 微信小程序wx:for循环列表渲染
- 微信小程序的多层循环嵌套
- 微信小程序模板中使用循环
- OTG线不支持移动硬盘的问题
- Android开发五大布局
- 使用ajaxfileupload插件上传文件取不到值
- BP的原理及实践
- 使用Apache-FTPClient完成文件上传和从配置文件中读取properties的使用
- 微信小程序循环数据
- java单链表操作
- 公钥、私钥、数字签名和RSA加密算法原理
- Mac配置mysql技巧
- 浅谈JAVA中 类加载机制与反射
- Easyui combobox设置不可编辑
- Web前端-HeadFirst笔记-Ch12-HTML5新标记
- ELF格式文件和BIN文件的区别
- python函数