Javascript 通过导航器传递状态

我使用的是React Native core Navigator组件，但在按下导航栏中的按钮时，无法确定如何在组件之间传递数据。下面是一些示例代码的设置，我有

const NavigationBarRouteMapper = {
  Title: (route, navigator) => {
    let title;
    switch (route.component.displayName) {
      case 'FirstScreen':
        title = 'First Screen';
        break;
    }

    return (
      <Text>
        {title}
      </Text>
    )
  },
  LeftButton: (route, navigator) => {
    let onButtonPress, buttonTitle;
    switch (route.component.displayName) {
      case 'SecondScreen':
        buttonTitle = 'Close';
        onButtonPress = () => navigator.pop();
        break;
    }

    return (
      <TouchableOpacity
        onPress={onButtonPress}>
        <Text>
          {buttonTitle}
        </Text>
      </TouchableOpacity>
    )
  },
  RightButton: (route, navigator) => {
    let onButtonPress, buttonTitle;
    switch (route.component.displayName) {
      case 'SecondScreen':
        buttonTitle = 'Save';
        onButtonPress = () => {}; // @TODO Call onButtonPress in SecondScreen component
        break;
    }

    return (
      <TouchableOpacity
        onPress={onButtonPress}>
        <Text>
          {buttonTitle}
        </Text>
      </TouchableOpacity>
    );
  }
};

const App = React.createClass({
  renderScene(route, navigator) {
    return <route.component navigator={navigator} {...route.props} />;
  },
  render() {
    return (
      <Navigator
        style={styles.appContainer}
        initialRoute={{component: SplashScreen}}
        renderScene={this.renderScene}
        navigationBar={
          <Navigator.NavigationBar
            routeMapper={NavigationBarRouteMapper}
          />
        }
      />
    );
  }
});

const FirstScreen = React.createClass({
  onButtonPress() {
    this.props.navigator.push({component: SecondScreen});
  },
  render() {
    return (
      <View>
        <TouchableHighlight onPress={this.onButtonPress}>
          <Text>
            Click Me
          </Text>
        </TouchableHighlight>
      </View>
    );
  }
});

const SecondScreen = React.createClass({
  getInitialState() {
    return {
      input: ''
    }
  },
  onButtonPress() {
    if (this.state.input.length) {
      // Do something with this.state.input such as POST to remote API
      this.props.navigator.pop();
    }
  },
  render() {
    return (
      <View style={styles.container}>
        <TextInput
          onChangeText={(input) => this.setState({input})}
          value={this.state.input}
        />
      </View>
    );
  }
});

const NavigationBarRouteMapper={
标题：（路线、导航器）=>{
让标题；
交换机（route.component.displayName）{
案例“第一屏”：
标题=‘第一屏’；
打破
}
返回(
{title}
)
},
LeftButton：（路线、导航器）=>{
让我们来按一下钮扣，钮扣；
交换机（route.component.displayName）{
案例“第二屏幕”：
钮扣=关闭；
onButtonPress=（）=>navigator.pop（）；
打破
}
返回(
{纽扣}
)
},
右按钮：（路线、导航器）=>{
让我们来按一下钮扣，钮扣；
交换机（route.component.displayName）{
案例“第二屏幕”：
按钮=‘保存’；
onButtonPress=（）=>{}；/@TODO在SecondScreen组件中调用onButtonPress
打破
}
返回(
{纽扣}
);
}
};
const App=React.createClass({
renderScene（路线、导航器）{
返回；
},
render（）{
返回(
);
}
});
const FirstScreen=React.createClass({
onButtonPress（）{
this.props.navigator.push（{component:SecondScreen}）；
},
render（）{
返回(
点击我
);
}
});
const SecondScreen=React.createClass({
getInitialState（）{
返回{
输入：“”
}
},
onButtonPress（）{
if（this.state.input.length）{
//使用this.state.input执行一些操作，例如发送到远程API
this.props.navigator.pop（）；
}
},
render（）{
返回(
this.setState（{input}）}
值={this.state.input}
/>
);
}
});

---

您可以从注释中看到，我在SecondScreen的状态中存储了一个值，当有人点击Save按钮时，我希望对该值进行处理。有什么想法吗？

在renderScene函数中，当返回“route.component”时，您可以传递道具并在组件中阅读它们