微信小程序 wx:for 点击事件

列表点击事件与数据获取

最新推荐文章于 2024-06-30 11:26:58 发布

原创最新推荐文章于 2024-06-30 11:26:58 发布 · 1.4w 阅读

14 ·

CC 4.0 BY-SA版权

微信小程序专栏收录该内容

1 篇文章

订阅专栏

本文介绍如何在WXML中为列表的每一项添加点击事件并获取每项的数据。通过设置bindtap属性和使用dataset来捕获点击事件，进而实现导航等功能。

为列表的每个小项都添加点击事件，并获得每个项的一些数据。

wxml中：

  <view wx:for="{{array}}">
    <view bindtap='click' data-name='{{item.name}}'>{{item.name}}</view>
  </view>

click是点击事件，data-any这个后面的any可以是任何自己定义的。item是默认的，name是JS中定义的。

Page({
  data: {
    array: [{ "name": "logs" },{"name":"scroll-view"}]
  },
  click: function (e) {
    //获取到name对应的值
    var name = e.currentTarget.dataset.name;
    console.log("a",name);



    wx.navigateTo({
      url: '../logs/logs',
    })
  }
})