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

上一篇下一篇

猜你喜欢

热点阅读