事件绑定的写法和组件属性一致,以key="value"的形式,其中:
1、key以bind或者catch开头,然后跟上事件的类型,如bindtap、catchtouchstart。
2、value是一个字符串,需要在对应的页面Page构造器中定义同名的函数,否则触发事件时在控制台会有报错信息。bind和capture-bind的含义分别代表事件的冒泡阶段和捕获阶段,如图:
以下示例中,点击 inner view 会先后调用handleTap2、handleTap4、handleTap3、handleTap1。
<!-- 事件的冒泡和捕获 -->
<view
id="outer"
bind:touchstart="handleTap1"
capture-bind:touchstart="handleTap2"
>
outer view
<view
id="inner"
bind:touchstart="handleTap3"
capture-bind:touchstart="handleTap4"
>
inner view
</view>
</view>
bind事件绑定不会阻止冒泡事件向上冒泡,catch事件绑定可以阻止冒泡事件向上冒泡。如果将上面代码中的第一个capture-bind改为capture-catch,将只触发handleTap2(capture-catch将中断捕获阶段和取消冒泡阶段)。
<!-- 使用catch阻止事件的传递 -->
<view
id="outer"
bind:touchstart="handleTap1"
capture-catch:touchstart="handleTap2"
>
outer view
<view
id="inner"
bind:touchstart="handleTap3"
capture-bind:touchstart="handleTap4"
>
inner view
</view>
</view>
原文链接:https://developers.weixin.qq.com/ebook?action=get_post_info&docid=000846df9a03909b0086a50025180a