React App中的Socket IO多个连接

Question

我没有在此处粘贴任何代码，因为这是一个非常直截了当的问题。 在我的父组件中，我试图将socket.io传递为子组件之一的道具，但是我看到了多个连接。在我的子组件中，我正在侦听componentDidMount中的事件。我在子componentDidMount中尝试了console.log，并且只被调用了一次。

在所有组件之间仅使用单个连接的标准方法是什么？以及为什么要像道具那样在服务器端显示多个连接呢？

Answer 1

我要做的是拥有一个中央套接字控制器socketController，在其init方法内部，我将其连接到套接字并开始查看消息。

每条通过的消息都应该具有“ dataType”（可以确定其去向）和“ data”（即要传递的数据）。

然后socketController应该允许任何内容传递给侦听器socketController.addListener = function(dataType, listener) {}，并且您可以为每个dataType保留一个侦听器数组。还要实现removeListener与以上功能一起使用。

然后在socketController中的每个套接字消息上，检查dataType，遍历该dataType的所有侦听器，然后向其发送数据。

在组件中，您可以在componentDidMount中设置侦听器，并在componentWillUnmount中将其删除。