weex-27-通用事件

1DB65BB9-1BDC-44B8-9AE2-3E86862A9942.png

本节学习目标

• 点击事件(click)
• 长按手势(longpress)
• appear 出现事件
• Disappear 消失事件
• viewappear 事件
• viewdisappear 事件

接下来我们一个一个介绍

• 点击事件

click

示例如下

 
默认参数
 
传递常量参数

 
传递变量参数

 
传递多个参数

如上示例中定义的单击事件方法tap中,如果不传递参数,即使用默认参数的情况,系统会自动传递如下对象当成方法的参数

type: click
target: 触发点击事件的目标组件
timestamp: 触发点击事件时的时间戳
...

部分参数截图

DFC50306-C5CE-411C-A16C-58E8D4ACB284.png

其实

默认参数

的完整写法为`

默认参数

``

?思考:如果你既要传递自己的参数,又要保留系统参数,应该怎么写?

@longpress="longpress(index,$event)"

• 长按事件

longpress

longpress事件默认参数为

type : longpress
target : 触发长按事件的目标组件
timestamp : 长按事件触发时的时间戳
...

参数用法同上

• appear 事件

appear
给组件绑定appear事件,那么当这个组件出现在屏幕上时，该事件将被触发

示例

绑定了appear

事件参数

type : appear
target : 触发 Appear 事件的组件对象
timestamp : 事件被触发时的时间戳
direction : 触发事件时屏幕的滚动方向，up 或 down
...

• disappear事件
  disappear

当一个组件绑定了 disappear
事件，那么当这个组件被滑出屏幕变为不可见状态时，该事件将被触发。

事件对象

type : disappear
target : 触发 Disappear 事件的组件对象
timestamp : 事件被触发时的时间戳
direction : 触发事件时屏幕的滚动方向，up 或 down

示例如下

绑定disappear

• viewappear事件

viewappear
该事件将会在打开新页面时被触发(如push一个新的页面)

该事件必须绑定在根节点上如下

事件对象

type : viewappear
target : 触发事件的组件对象
timestamp : 事件被触发时的时间戳
...

• viewdisappear

viewdisappear

该事件将会在页面关闭时触发(如pop)

该事件也必须绑定在根节点上

事件对象

type : viewdisappear
target : 触发事件的组件对象
timestamp : 事件被触发时的时间戳

注意事项

• 和 组件 不支持click或者longpress 事件,事件 请使用 change 或 input 事件来代替
• H5 不支持 viewdisappear 和 viewappear

简单的使用就介绍到这里

558F171F-A623-4F25-976F-7E86A578AF9B.png