微信小程序自定义事件怎么使用？

　　关于微信小程序自定义的内容，小编在微信小程序商店做过一些介绍，今天要为大家补充的是微信小程序自定义事件，具体要怎么使用呢?使用过程中会要注意一些什么问题?一起来看看吧。

　　小程序自定义事件的使用方式：

　　在组件中绑定一个事件处理小程序自定义函数。

　　如bindtap，当用户点击该组件的时候会在该页面对应的Page中找到相应的事件处理函数。

　　Click me!

　　在相应的Page定义中写上相应的事件处理函数，参数是event。

　　Page({ tapName: function(event) { console.log(event) }})

　　可以看到log出来的信息大致如下

　　{"type": "tap","timeStamp": 1252,"target": { "id": "tapTest", "offsetLeft": 0, "offsetTop": 0, "dataset": { "hi": "MINA" }},"currentTarget": { "id": "tapTest", "offsetLeft": 0, "offsetTop": 0, "dataset": { "hi": "MINA" }},"touches": [{ "pageX": 30, "pageY": 12, "clientX": 30, "clientY": 12, "screenX": 112, "screenY": 151}],"detail": { "x": 30, "y": 12}}

　　小程序自定义事件详解：

　　事件分类

　　事件分为冒泡事件和非冒泡事件

　　1.冒泡事件：当一个组件上的事件被触发后，该事件会向父节点传递。

　　2.非冒泡事件：当一个组件上的事件被触发后，该事件不会向父节点传递。

　　WXML的冒泡事件列表：

　　类型触发条件

　　touchstart手指触摸

　　touchmove手指触摸后移动

　　touchcancel手指触摸动作被打断，如来电提醒，弹窗

　　touchend手指触摸动作结束

　　tap手指触摸后离开

　　longtap手指触摸后，超过350ms再离开

　　注：除上表之外的其他组件自定义事件都是非冒泡事件，如

　　的submit事件，的input事件，的scroll事件，(详见各个组件)

　　事件绑定

　　事件绑定的写法同组件的属*，以key、value的形式。

　　key以bind或catch开头，然后跟上事件的类型，如bindtap, catchtouchstart

　　value是一个字符串，需要在对应的Page中定义同名的函数。不然当触发事件的时候会报错。

　　bind事件绑定不会阻止冒泡事件向上冒泡，catch事件绑定可以阻止冒泡事件向上冒泡。

　　如在下边这个例子中，点击inner view会先后触发handleTap1和handleTap2(因为tap事件会冒泡到middle view，而middle view阻止了tap事件冒泡，不再向父节点传递)，点击middle view会触发handleTap2，点击outter view会触发handleTap1。

　　outer view middle view inner view

　　事件对象

　　如无特殊说明，当组件触发事件时，逻辑层绑定该事件的处理函数会收到一个事件对象。

　　事件对象的属*列表：

　　属*类型说明

　　typeString事件类型

　　timeStampInteger事件生成时的时间戳

　　targetObject触发事件的组件的一些属*值集合

　　currentTargetObject当前组件的一些属*值集合

　　touchesArray触摸事件，触摸点信息的数组

　　detailObject额外的信息

　　通用事件类型

　　timeStamp

　　该页面打开到触发事件所经过的毫秒数。

　　target

　　触发事件的源组件。

　　属*说明

　　id事件源组件的id

　　dataset事件源组件上由data-开头的自定义属*组成的集合

　　offsetLeft, offsetTop事件源组件的坐标系统中偏移量

　　currentTarget

　　事件绑定的当前组件。

　　属*说明

　　id当前组件的id

　　dataset当前组件上由data-开头的自定义属*组成的集合

　　offsetLeft, offsetTop当前组件的坐标系统中偏移量

　　说明: target和currentTarget可以参考上例中，点击inner view时，handleTap3收到的事件对象target和currentTarget都是inner，而handleTap2收到的事件对象target就是inner，currentTarget就是middle

　　dataset

　　在组件中可以定义数据，这些数据将会通过事件传递给SERVICE。 书写方式： 以data-开头，多个单词由连字符-链接，不能有大写(大写会自动转成小写)如data-element-type，最终在event.target.dataset中会将连字符转成驼峰elementType。

　　示例：

　　DataSet Test

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

　　touches

　　touches是一个触摸点的数组，每个触摸点包括以下属*：

　　属*说明

　　pageX,pageY距离文档左上角的距离，文档的左上角为原点 ，横向为X轴，纵向为Y轴

　　clientX,clientY距离页面可显示区域(屏幕除去导航条)左上角距离，横向为X轴，纵向为Y轴

　　screenX,screenY距离屏幕左上角的距离，屏幕左上角为原点，横向为X轴，纵向为Y轴

　　特殊事件所携带的数据，如小程序form表单组件的提交事件会携带用户的输入，媒体的错误事件会携带错误信息，详见组件定义中各个事件的定义。

　　以上就是关于微信小程序自定义事件的全部资料了，希望大家看完之后能够对微信小程序自定义事件有所了解，如果有需要，还可以参照微信小程序商店提供的教程进行开发设置。

　　关于微信小程序自定义客服的问题及解答

　　怎样实现微信小程序自定义轮播?

　　微信小程序自定义loading组件显示载入动画方法