什么是 global-eventemitter
global-eventemitter 是一个用于事件传递的 NPM 包，它提供了全局的事件对象，可以在一个组件中触发事件，在另一个组件中监听并处理该事件。
安装方式
可以通过 npm 安装 global-eventemitter：
npm install global-eventemitter --save
使用方法
在使用 global-eventemitter 时，我们需要先初始化它，然后就可以进行事件的触发和监听。
初始化：
import globalEventEmitter from 'global-eventemitter'; globalEventEmitter.initialize();
在组件中触发事件：
globalEventEmitter.emit('event-name', data);监听事件并处理：
const handler = function(data) {
console.log(data);
};
globalEventEmitter.addListener('event-name', handler);移除事件监听器：
globalEventEmitter.removeListener('event-name', handler);实际应用
我们可以通过一个简单的示例来说明 global-eventemitter 的实际应用。
假设我们有两个组件，组件 A 和组件 B。我们需要在组件 A 中触发一个事件，在组件 B 中监听并处理该事件。由于两个组件不在相同的父组件中，它们之间的通信需要通过事件进行。
组件 A：
-- -------------------- ---- -------
------ ------------------ ---- ----------------------
----- ---------- ------- --------------- -
----------------- - -- -- -
----- ---- - - ---- ----- --
------------------------------------- ------
-
-------- -
------ -
-----
------- -------------------------------------- -----------
------
--
-
-组件 B：
-- -------------------- ---- -------
------ ------------------ ---- ----------------------
----- ---------- ------- --------------- -
----- - - ----- ---- --
------------------- -
-------------------------------------------- ------------------
-
---------------------- -
----------------------------------------------- ------------------
-
----------- - ------ -- -
--------------- ---- ---
-
-------- -
------ -
---------- ---------------------------------------
--
-
-当用户在组件 A 中点击按钮时，组件 B 中的 handleEvent 方法会被执行，将最新的数据更新到组件 B 的状态中。这样，我们就实现了两个组件之间的通信。
总结
在实际开发中，组件之间的通信需要通过props或context，但在某些场景下，使用这些方式可能不太方便或不太适合。此时，我们可以使用 global-eventemitter 这样的工具来简化组件之间的通信实现。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60066e70255dee6beeee7463