更好的方法在react-native中的组件之间共享变量

Question

我正在使用react-native和socket.io创建一个应用程序。使用io.connect(...)与socket.io连接后，我需要使用可在任何组件中使用的套接字客户端保存变量。

但问题是：

1 - 我正在使用react-navigation，所以我不能作为属性从组件传递，因为连接不是在导航器根目录中进行的，而是在子筛子中进行的

2 - 我无法使用this.props.navigation.navigate(route, {socketIo})作为导航参数传递，因为它是一个循环对象，而react-navigation模块中的JSON.stringify会在尝试处理数据时抛出错误

3 - 一旦它生成多个连接

，我就无法制作模块并将其导入其他文件

解决我的问题的解决方法是设置一个像这样的全局变量：

global.socket = io.connect(...)

但谷歌搜索时发现很多人都说这不是一个好方法。有什么方法可以更好地解决这个问题吗？

Answer 1

在react本机应用程序中共享变量和方法是一种特殊情况，因为您需要与私有方法共享 socket 连接以发出和接收事件，而不是仅共享变量。

在这种情况下，Redux还不够。我通过使用新的StackNavigator创建导航器容器，处理套接字连接和此容器中的事件并管理Redux的操作来解决这个问题。例如：如果您需要在某个屏幕上调度事件，可以使用Redux调度该事件并监听SocketContainer然后执行IO操作。

此外，我创建了一个Polyfill，因为React Native中的套接字实现有userAgent错误。您可以在this article了解更多信息。

我的实施的完整示例可以是found here。

Answer 2

这看起来像redux的用例。 Redux允许您在所有组件之间共享数据。