React Native全局状态管理

Question

我有一个状态变量，它在我的一个页面上设置，但我希望该状态值也可以在另一个页面上访问。不太确定如何实现这一点。

例如，在mainpage.ios.js中：

var MainPage = React.createClass({
  getInitialState: function() {
    return {
      value: 1
    };
  },

然后在 otherpage.ios.js 上，我想根据前一页上已经设置的值进行更新。这些不同的页面是通过选项卡栏选择的。因此，该值在所有页面之间会被有效地全局共享。

- Hasen

Answer 1

为了在React Native中实现多个组件之间的共享全局状态，您应该利用Flux实现。我个人更喜欢redux，但您可以使用任何您喜欢的。以下是使用React Native的redux示例：https://github.com/alinz/example-react-native-redux。

- Ryan McDermott

Answer 2

没关系，我已经知道怎么做了。对于那些不知道的人，这是我是如何做到的。据我所见，没有全局状态，你只需要将props传递给每个页面组件。

所以对于mainpage.ios.js，你需要引入otherpage.ios.js：

 var OtherPage = require('./otherpage');

然后当您使用该元素时，需要传递属性（props）：

    <OtherPage value={2}/>

或者

    <OtherPage value={this.state.value}/>

然后在 otherpage.ios.js 文件中，您可以使用 this.props.value 引用该变量。

- Hasen

---

它并不完美，因为它只是父子通信。仍然不确定如何进行子父通信。该变量远非全局，但不幸的是，React Native的文档非常稀少，关于这方面没有任何内容。 - Hasen

有一件事你应该始终依赖，那就是单一流程。如果你希望你的子组件与父组件进行通信，只需触发一个动作，将其传递给存储并进行修改。现在存储会通知父组件有新的更新。如果你这样做，逻辑会变得更加简单。 - Ali