[小程序开发] 事件

一、事件绑定

        绑定事件的方式

        1、bind:事件名，例：<view bind:tap="fnName"></name>

        2、bind事件名，例：<view bindtap="fnName"></name>

<button type="primary" size="default" bind:tap="handler">绑定事件</button>
<button type="warn" size="default" bindtap="handler">绑定事件</button>

事件处理函数需要写到.js文件中，在page方法中定义事件处理函数

二、事件分类

        1、冒泡事件

               当一个组件的事件被触发后，该事件会向父节点传递，父节点事件也会被触发。

        2、非冒泡事件

               当一个组件的事件被触发后，该事件会向父节点传递，父节点事件不会被触发。

使用bind绑定的事件，会触发事件冒泡，如果想阻止事件冒泡，可以使用catch来绑定事件。

<view class="catch" catchtap="parentCatchVal">
	<button catchtap="btnCatchVal">按钮</button>
</view>

 三、事件传参

        在触发事件是，将一些数据作为参数传递给事件处理函数的过程。

        在组件上通过date-*的方式定义需要传递的数据，其中*是自定义的属性，然后通过事件对象进行获取自定义数据。例：<view data-id="100" bindtap="handler"/>

<button bind:tap="btnHandler" data-id="1" data-name="tom">按钮</button>

传递参数时使用-分割会被转换成小驼峰写法，传递参数时使用小驼峰写法被转换成小写。

例：data-parent-id传参，接收时应写成parentId；data-parentId传参，接收时应写成parentid。

四、mark

        make是一种自定义属性，可以在组件是添加，用来识别具体触发事件的target节点。同时mark还可以用于承载一些自定义数据。例：<view mark:id="1" bindtap="handler"/>

<button bindtap="btnMarkHandler" mark:id="1" mark:name="tom">按钮</button>