程序中通过 for 循环绑定 item 点击事件的实现方式

GS 198 2024-08-14

这篇文章主要介绍了小程序中通过 for 循环绑定 item 点击事件的实现方式的实现,有着一定的参考价值,现在分享给大家,有需要的朋友可以参考一下

微信展示列表效果借助于 wx:for 

 简单写一个列表(wxml文件中):

  图片.png

 对应的数据源(js文件中):

  图片.png

写一个点击监听:

  图片.png

 效果:

  

以上、可以实现列表的item点击效果,但是无法到点击的item对应的数据源数据

解决方法

给有点击事件的组件添加一个 data-any  属性 any可以是任意数据类型。

从下图可以看出我们遍历expertData数组,每一个item 定义为info, 在第二行最后 加了一句  data-bean="{{info}}"

  图片.png

 然后修改点击事件:

  图片.png

 发现可以用此方法去除点击的item对应的数据对象,以及该对象中某个属性值 

   控制台打印信息:

  图片.png

 这样就可以获取到列表展示数据中某一个item对应的数据了。

以上就是小程序中通过 for 循环绑定 item 点击事件的实现方式的详细内容!


版权声明:本文内容由网络用户投稿,版权归原作者所有,本站不拥有其著作权,亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容,请联系我们jiasou666@gmail.com 处理,核实后本网站将在24小时内删除侵权内容。

上一篇:小程序中利用 view 内部组件实现页面排版功能的方法
下一篇:小程序中动态实现组件显示与隐藏的控制策略
相关文章

 发表评论

暂时没有评论,来抢沙发吧~