[英]React Native: React Navigation StackNavigator not working. Getting error: “undefined is not an object (evaluating 'this.props.navigation.navigate')”
I am trying to use React Navigation and StackNavigator to navigate around my app.我正在尝试使用 React Navigation 和 StackNavigator 来浏览我的应用程序。
I have a button with onPress={() => navigate('DetailsScreen')
, and I was hoping that would take me to the DetailsScreen
, but I'm getting the following error:我有一个带有onPress={() => navigate('DetailsScreen')
的按钮,我希望这能带我到DetailsScreen
,但我收到以下错误:
E ReactNativeJS: undefined is not an object (evaluating 'this.props.navigation.navigate') E ReactNativeJS:undefined 不是一个对象(评估'this.props.navigation.navigate')
What do I need to add in order to get this working?我需要添加什么才能使其正常工作?
See my code here: https://gist.github.com/chapeljuice/bef4b0a4dedef2994c81f3634b81aa43在此处查看我的代码: https : //gist.github.com/chapeljuice/bef4b0a4dedef2994c81f3634b81aa43
You component is not navigation aware (it's not a screen).您的组件不具有导航意识(它不是屏幕)。 Hence, you have 2 common solutions here:因此,您在这里有 2 个常见的解决方案:
Pass the navigation prop from your parent component (if it's a screen).从你的父组件传递导航道具(如果它是一个屏幕)。
<Card navigation={navigation} />
This is the simplest solution.这是最简单的解决方案。
withNavigation
使用高阶组件withNavigation
If the parent component is not navigation aware or if it's too complex to pass down the props, you can use the HOC withNavigation
:如果父组件不支持导航,或者传递 props 太复杂,您可以使用 HOC withNavigation
:
export default withNavigation(connect(mapStateToProps)(Card))
You will then have the navigation
prop available.然后,您将可以使用navigation
道具。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.