欢迎光临
我的个人博客网站

微信小程序-点击事件传递参数


1、dataset

在标签中利用 data-xxx  来定义你要传入的参数,,

然后事件中传入 event 用 event.currentTarget.dataset.xxx 来取你传入的值

在 WXML 中,这些自定义数据以 data- 开头,多个单词由连字符 - 连接。这种写法中,连字符写法会转换成驼峰写法,而大写字符会自动转成小写字符。如:

  • data-element-type ,最终会呈现为 event.currentTarget.dataset.elementType ;
  • data-elementType ,最终会呈现为 event.currentTarget.dataset.elementtype 。
<view data-alpha-beta="1" data-alphaBeta="2" bindtap="bindViewTap"> DataSet Test </view>

Page({   bindViewTap:function(event){     event.currentTarget.dataset.alphaBeta === 1 // - 会转为驼峰写法     event.currentTarget.dataset.alphabeta === 2 // 大写会转为小写   } })

2、mark

 2.7.1 以上,可以使用 mark 来识别具体触发事件的 target 节点。此外, mark 还可以用于承载一些自定义数据(类似于 dataset )。

当事件触发时,事件冒泡路径上所有的 mark 会被合并,并返回给事件回调函数。(即使事件不是冒泡事件,也会 mark 。)

<view mark:myMark="last" bindtap="bindViewTap">   <button mark:anotherMark="leaf" bindtap="bindButtonTap">按钮</button> </view>

如果按钮被点击,将触发 bindViewTap 和 bindButtonTap 两个事件,事件携带的 event.mark 将包含 myMark 和 anotherMark 两项。

Page({   bindViewTap: function(e) {     e.mark.myMark === "last" // true     e.mark.anotherMark === "leaf" // true   } })

细节注意事项:

  • 如果存在同名的 mark ,父节点的 mark 会被子节点覆盖。
  • 在自定义组件中接收事件时, mark 不包含自定义组件外的节点的 mark 。
  • 不同于 dataset ,节点的 mark 不会做连字符和大小写转换。
赞(0) 打赏
未经允许不得转载:张拓的天空 » 微信小程序-点击事件传递参数
分享到: 更多 (0)

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

专业的IT技术经验分享 更专业 更方便

联系我们本站主机

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏