当前阅读教程:微信小程序入门教程 > 数组 | |
阅读(22555525) 收藏 赞(5685) 分享 | |
上一篇: 对象 | 下一篇: 逻辑语句 |
1.数组的定义和使用在小程序中对应的.js文件里面的data区块定义数组,然后在对应的.wxml页面使用数组,使用数组我们这里利用for循环语句来循环显示数组的内容。 .js文件中数组的定义示例 如下: data: { people: ["张三", "李四", "王五"] }, .wxml文件中显示数组的代码示例 如下: <!--基本使用--> <view>{{people[0]}}</view> <!--数组的长度--> <view>{{people.length}}</view> <!--循环显示数组--> <view wx:for="{{people}}"> {{index}}{{item}} </view> <!--循环显示数组2--> <view wx:for="{{people}}" wx:for-index="id" wx:for-item="xingming" > <view>序号:{{id}} | 内容:{{xingming}}</view> </view> 效果如图9-5所示。 2.单字段对象数组的定义和使用在小程序中对应的.js文件里面的data区块定义对象数组,然后在对应的.wxml页面使用for循环语句来显示数组内的内容。这里的对象数组是指的数组里面的每个成员是对象。 .js文件中数据的定义示例 如下: data: { shuzu: [ { shuiguo: "苹果" }, { shuiguo: "香蕉" }, { shuiguo: "西瓜" }, { shuiguo: "琵琶" } ], }, .wxml文件中数据的显示如下: <view wx:for="{{shuzu}}"> {{index}}:{{item.shuiguo}} </view> 效果如图9-6所示。 3.多字段对象数组的定义和使用.js文件中数据的定义示例 如下: data: { shuzu2: [ { "id": 1, "title": "2018年企业最新代理政策!" }, { "id": 2, "title": "2018年劳动节放假时间和安排通知" }, { "id": 3, "title": "帮助你在云平台上搭建自己的" }, { "id": 4, "title": "关注我们的最新企业微信号" }, { "id": 5, "title": "帮助你在云平台上搭建自己" } ] }, .wxml文件中数据的显示如下: <view wx:for="{{shuzu2}}"> {{index}}:{{item.title}} </view> 效果如图9-7所示。 |
|
上一篇: 对象 | 下一篇: 逻辑语句 |