在子组件中反应 this.props.navigation.openDrawer()？

Question

我有一个通过 React Navigation 2 的 openDrawer 方法在我的视图中运行良好。但是，当我创建一个子组件并将我的 openDrawer 按钮放入其中时，我无法再访问 this.props.navigation。我如何将它传递给子组件？我查看了状态，但这似乎不是解决此问题的正确方法？我是 React/Native 的新手。这是我在主视图中的按钮，它可以正常工作。

<View style={styles.menuBar}> 
<TouchableOpacity style={styles.menuButton} 
 onPress={() => this.props.navigation.openDrawer()}>
<Text>&#9776;</Text>
</TouchableOpacity>
// Other Stuff inside menuBar.
</View>

此菜单按钮还有一些其他项目，我想在 class 组件中作为子组件组合在一起，我可以将其导入各种屏幕。

import { topMenuBar } from '../components/menuBar';
<topMenuBar />

但是，菜单按钮现在不再有效。我知道这是因为 this.props 现在指的是 class topMenuBar 而不是原来的 class，它是导航结构的一部分。但是我不知道这一步的正确过程，无论是使用状态还是在子方法中以某种方式从反应导航调用 NavigationActions。

感谢您的帮助！

Answer 1

使用 react-navigation 打开的每个组件都有 "this.props.navigation".

如果您在子组件中需要它，您应该将其作为 prop 传递给它们：

export default class Home extends Component{
    render(){
        <View>
            <OtherComponent navigation = {this.props.navigation}/>
        </View>
    }
}

注意：如果您想要更好的帮助，您应该始终提供创建 fiddle 的代码并更好地组织您的答案..

在子组件中反应 this.props.navigation.openDrawer()？

React this.props.navigation.openDrawer() in child component?

react-native

react-native-navigation-v2