react 全局传值的另一种方案 EventEmitter
2022-01-22 本文已影响0人
想溜了的蜗牛
这周遇到一个需要使用redux 或 context 来全局传值的情况,在查询资料的时候看到使用 Node.js EventEmitter 全局监听的方式也可以处理。本文记录一下。
// 引入
var EventEmitter = require('events').EventEmitter;
// 创建对象
var event = new EventEmitter();
// 事件监听
event.on('some_event', function() {
console.log('some_event 事件触发');
});
setTimeout(function() {
// 发送事件
event.emit('some_event');
}, 1000);
EventEmitter 的每个事件由一个事件名和若干个参数组成,事件名是一个字符串,通常表达一定的语义。对于每个事件,EventEmitter 支持 若干个事件监听器。
当事件触发时,注册到这个事件的事件监听器被依次调用,事件参数作为回调函数参数传递。
让我们以下面的例子解释这个过程:
//event.js 文件
var events = require('events');
var emitter = new events.EventEmitter();
emitter.on('someEvent', function(arg1, arg2) {
console.log('listener1', arg1, arg2);
});
emitter.on('someEvent', function(arg1, arg2) {
console.log('listener2', arg1, arg2);
});
emitter.emit('someEvent', 'arg1 参数', 'arg2 参数');
执行以上代码,运行的结果如下:
$ node event.js
listener1 arg1 参数 arg2 参数
listener2 arg1 参数 arg2 参数
以上例子中,emitter 为事件 someEvent 注册了两个事件监听器,然后触发了 someEvent 事件。
运行结果中可以看到两个事件监听器回调函数被先后调用。 这就是EventEmitter最简单的用法。
EventEmitter 提供了多个属性,如 on 和 emit。on 函数用于绑定事件函数,emit 属性用于触发一个事件。接下来我们来具体看下 EventEmitter 的属性介绍。
以上内容引自 Node.js EventEmitter