如何在React-Native中的导航器的多个场景之间共享状态

Question

我想分享我的应用程序的所有屏幕的用户信息.(例如类似于webapps中的会话).如何以适当的标准方式在react-native中实现这一点.

到目前为止,我已经通过将User的所有信息保持为Main组件中的状态,然后将Main Component的状态作为子组件的属性传递来实现此目的.以下是组件的缩短代码 -

 var MainComponent = React.createClass({
  getInitialState: function(){  
    return {
      user: {
        mobileNumber: "",
        emailId:"",        
      },
      userValidationStatus: false
    };
  },
  _renderScene: function(){
     switch(route.id){
      case 1:
          return <Screen1 navigator={navigator} parentState={this.state}/>
      case 2:
          return <Screen2 navigator={navigator} parentState={this.state} />   
      default: 
          return <Screen1 navigator={navigator} /> 
    }
  }, 
  render: function(){
    return (
        <Navigator
          initialRoute={{ 
            id: 1,
            title: 'someTitle'               
          }}
          renderScene={this._renderScene}   
          navigator={this.props.navigator}  
        />    
    );
  }
});

var Screen1 = React.createClass({ 
  render: function(){
    return ( 
      <View>     
            <TextInput
              autoFocus='true'             
              onChangeText={(mobileNumber) => this.props.parentState.user.mobileNumber=mobileNumber} 
              value={this.state.mobileNumber} 
            />  
            <TextInput  
              onChangeText={(emailId) => this.props.parentState.user.emailId=emailId} 
              value={this.state.emailId} 
            /> 
       </View>
    );
  }
});
var Screen2 = React.createClass({ 
  render: function(){
    return ( 
      <View>     
            <TextInput
              autoFocus='true'             
              onChangeText={(mobileNumber) => this.props.parentState.user.mobileNumber=mobileNumber} 
              value={this.state.mobileNumber} 
            />  
            <TextInput  
              onChangeText={(emailId) => this.props.parentState.user.emailId=emailId} 
              value={this.state.emailId} 
            /> 
       </View>
    );
  }
});

这是实现这一目标的正确方法吗？如果不是,实现此类功能的正确方法是什么.

Answer 1

您将主状态保留在上层（控制器）组件并将数据作为道具向下传递是正确的。

另一种方法是使用像Flux或Redux（Flux 的实现）这样的库/思想来做到这一点并在应用程序变得更加复杂时管理应用程序的状态。

互联网及其文档中提供了很多教程，至少应该可以帮助您入门。在深入 Redux 之前我会开始学习 Flux。