zoukankan      html  css  js  c++  java
  • 小程序-for循环遍历的使用

    .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>
  • 相关阅读:
    N个数求和
    求整数段和
    连续因子
    L1-005 考试座位号
    PTA Java tips(转载)
    个位数统计
    flink编译支持CDH6.2.0(hadoop3.0.0)
    hdfs/hbase 程序利用Kerberos认证超过ticket_lifetime期限后异常
    spring boot通过@Bean注解定义一个Controller
    【TypeScript】TypeScript 学习 2——接口
  • 原文地址:https://www.cnblogs.com/silent007/p/10081895.html
Copyright © 2011-2022 走看看