reactjs - 如何在反应原生屏幕之间共享状态？

Question

我正在尝试使用 react native 和 react 导航构建一个应用程序，这样在一个屏幕上更改某些内容也会在另一个屏幕上更改它。

到目前为止，我发现能够在两个屏幕之间同步数据的唯一方法是使用带有onPress={() => navigate('OtherScreen', this.state)}. 这有两个问题。首先，它只适用于我明确调用导航的地方——当我滑动改变屏幕时，它不会传输数据。但大多数情况下，这似乎与反应哲学相反，即数据应该通过渲染调用从模型中提取，而不是一个渲染方法将数据推送到另一个组件中。

这完全把我难住了。我目前的“解决方案”是将我的整个应用程序编写在一个文件中，以便所有内容都在同一个范围内，并且我可以使用全局变量来存储全局状态。

我不可能是第一个遇到这个问题的人，而且我很难想象 react-native 没有任何内置方法来定义应用程序范围的数据存储。

是否有在 react-native 中全球共享数据的标准模式？

如何在两个屏幕之间同步数据？

标签： reactjsreact-nativeglobal-variablesreact-navigation

Answer 1

您可以使用Context或Redux在容器（屏幕）或组件之间共享。

Context旨在共享可被视为 React 组件树“全局”的数据，例如当前经过身份验证的用户、主题或首选语言。

Redux是 JavaScript 应用程序的可预测状态容器。