监听事件
- 监听的单位是节点,所以如果要设置监听,先要获取节点。
- 事件监听函数 on 可以传四个参数完成监听。
- 第一个参数指明监听的类型。
- 第二个参数为回调函数,可以有一个参数 event ,其属性如下表:
- 第三个参数是 target,用于绑定响应函数的调用者,可省略。会影响回调函数中关键字 this 的取值。
- 第四个参数 useCapture(boolean)是可选参数,用于设置事件监听为捕获模式。详见分发事件。
- 除了使用 on 监听,我们还可以使用 once 方法。once 监听在监听函数响应后就会关闭监听事件。
cc.Class({
extends: cc.Component,
properties: {
},
onLoad: function () {
this.node.on('mousedown', function ( event ) {
console.log('Hello!');
});
},
});
this.node.on('mousedown', function ( event ) {
this.enabled = false;
}.bind(this));
this.node.on('mousedown', function (event) {
this.enabled = false;
}, this);
关闭监听
- 当我们不再关心某个事件时,我们可以使用 off 方法关闭对应的监听事件。需要注意的是,off 方法的 参数必须和 on 方法的参数一一对应,才能完成关闭。
cc.Class({
extends: cc.Component,
_sayHello: function () {
console.log('Hello World');
},
onEnable: function () {
this.node.on('foobar', this._sayHello, this);
},
onDisable: function () {
this.node.off('foobar', this._sayHello, this);
},
});
发射事件
- 我们可以通过两种方式发射事件:emit 和 dispatchEvent。两者的区别在于,后者可以做事件传递。
- emit 发射事件只适用于本组件之内传输,并且在其他组件内监听不到此事件。
- 我们可以在 emit 函数的第二个参数开始传递我们的事件参数。同时,在 on 注册的回调里,可以获取到对应的事件参数。最多只支持传递 5 个事件参数。
cc.Class({
extends: cc.Component,
onLoad () {
this.node.on('foo', function (arg1, arg2, arg3) {
console.log(arg1, arg2, arg3);
});
},
start () {
let arg1 = 1, arg2 = 2, arg3 = 3;
this.node.emit('foo', arg1, arg2, arg3);
},
});
- 代码中,‘foo’是我们自定义的事件名称,当 emit 了一个 foo 之后,监听 foo 的监听器监听到信号,执行回调函数。
派送事件
- emit 只能在本组键中进行监听,如果我们要将信息发送给其他组件时,就需要用到 dispatchEvent 组件。
- 冒泡模式:将事件从事件发起节点,不断地向上传递给他的父级节点,直到到达根节点或者在某个节点的响应函数中做了中断处理 event.stopPropagation()
- 捕获模式:与冒泡模式相反,从最上层向下找。
this.node.dispatchEvent( new cc.Event.EventCustom('foobar', true) );
this.node.on('foobar', function (event) {
event.stopPropagation();
});
- cc.Event.EventCustom 是一个类,这里简单调用了构造函数,第一个参数是监听事件的名称,第二个参数是定义是否用冒泡模式
- 更多参数参考:官方文档