在本机组件之间共享变量的更好方法
Better approach to share a variable between components in react-native
我正在使用 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(...)
但是在谷歌搜索时我发现很多人说这不是一个好方法。有没有更好的方法来解决这个问题？
这看起来像是 redux 的用例。 Redux 允许您在所有组件之间共享数据。
跨 React Native 应用程序共享变量和方法是一种特殊情况，因为您需要与私有方法共享一个 socket 连接来发出和接收事件，而不是共享仅限变量。
在这种情况下，Redux 是不够的。我通过使用新 StackNavigator, handler the socket connection and events in this container and manage actions by Redux. Eg.: If you need to dispatch an event in some screen, you can dispatch that using Redux and listen in SocketContainer 创建一个导航器容器来解决这个问题，然后执行 IO 操作。
此外，我创建了一个 Polyfill，因为 React Native 中的套接字实现具有 userAgent error. You can read more about in this article.
我的实现的完整示例可以是found here.
我正在使用 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(...)
但是在谷歌搜索时我发现很多人说这不是一个好方法。有没有更好的方法来解决这个问题？
这看起来像是 redux 的用例。 Redux 允许您在所有组件之间共享数据。
跨 React Native 应用程序共享变量和方法是一种特殊情况，因为您需要与私有方法共享一个 socket 连接来发出和接收事件，而不是共享仅限变量。
在这种情况下，Redux 是不够的。我通过使用新 StackNavigator, handler the socket connection and events in this container and manage actions by Redux. Eg.: If you need to dispatch an event in some screen, you can dispatch that using Redux and listen in SocketContainer 创建一个导航器容器来解决这个问题，然后执行 IO 操作。
此外，我创建了一个 Polyfill，因为 React Native 中的套接字实现具有 userAgent error. You can read more about in this article.
我的实现的完整示例可以是found here.