.js文件:
Page({ /** * 页面的初始数据 */ data: { datas:[ { title: '提交申请', txt: '选择服务类型,填写基本信息,提交' }, { title: '材料审核', txt: '收到电网企业电话,与电网客户经理预约实地勘探时间、准备证明材料' }, { title: '等待业扩配套项目施工', txt: '工作人员按约定时间上门装表接电' }, { title: '竣工验收', txt: '工作人员按约定时间上门竣工验收' }, { title: '上门安装', txt:'工作人员按约定时间上门装表接电'} ] } })
.wxml文件:
<view class='neir' wx:for="{{datas}}" wx:key="title">
<!-- 索引为index -->
<text>{{index+1}}</text>
<text>{{item.title}}</text>
<view>{{item.txt}}</view>
</view>
释:关于wx:for的使用,相信用过angular.js和vue.js等框架的小伙伴们一眼就可以看出来了,没错,它们的用法其实是一样的,这里我们需要注意的是wx:key的使用
1、wx:key="字符串"
这个”字符串”代表在 for 循环的 datas中 item 的某个“属性”,比如这里的title和txt。
2、wx:key="*this"
这个关键字(*this)代表在 for 循环中的 item 本身,一般在没有键的数组里面使用,比如这个数组
arr: [1,2,3,4,5,6,7,8,9]
<view class='neir' wx:for="{{arr}}" wx:key="*this">
<text>{{item}}</text>
</view>