小程序 wx:for循环

小程序中基本的循环输出,根据数据多次循环输出控件:

.xml

	<block wx:for="{{testArr}}" wx:for-index="index" wx:for-item="cell" wx:key="index">
		<view>我是view{{index}}</view>
		<view catchtap="click" data-name="{{cell.name}}">名字是{{cell.name}}</view>
	</block>

.js

  data: {
     testArr:[{
       name:'张三'
     },{
      name:'李四'
     },{
      name:'王五'
     }]
  },
  click:function(e){
    console.log(e)
    var name = e.currentTarget.dataset.name;
    console.log('点击姓名'+name)
  },

根据代码可以看出wx:for-index 可以知道当前循环的是第几个 index可以拿来直接用 0开始

wx:for-item 可以指定任何名字 替代每一次循环的值  当前cell 就代表数组中的每一个对象

data-name  -后面的名字可以随便取 叫什么 就在js中取这个名字 就可以拿到 要传给js的值,例如demo中 我们传送了当前点击的名字 接的时候就要dataset.name拿到 输出结果如下

  • 1
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值