React Navigation 通过导航道具答案

【问题标题】：React Navigation pass navigation propReact Navigation 通过导航道具
【发布时间】：2019-04-25 18:26:33
【问题描述】：

根据反应导航文档，当您从堆栈导航器中选择一个屏幕时，导航道具会被传递。

例如，如果我注册了两条路线：主屏幕详情

export default class HomeScreen extends React.Component {


  render() {
    return (
      <View style={styles.container}>
      <Button
        onPress={() => this.props.navigation.navigate('Details')}>
        <Text>Press me</Text>
      </Button>
      </View>
    );
  }

}

够简单！但是让我们假设我有另一个组件被调用：

export default class HomeScreen extends React.Component {


  render() {
    return (
      <View style={styles.container}>
      <MyOtherComponent />
      </View>
    );
  }

}

我想要这个：

<Button
            onPress={() => this.props.navigation.navigate('Details')}>
            <Text>Press me</Text>
          </Button>

要参加，我该怎么做？我会将道具从 HomeScreen 传递给 MyOtherComponent 吗？

【问题讨论】：

标签： react-native-navigation

【解决方案1】：

我实际上在文档中找到了答案。对于其他没有像我一样阅读所有文档的人来说，这可能会有所帮助。

我可以使用withNavigation

在 MyOtherComponent 的示例中，我可以执行以下操作：

从 'react-navigation' 导入 { withNavigation };

class MyOtherComponent extends React.Component {
render stuff here
}

导出默认 withNavigation(MyBackButton);

【讨论】：