React Native：React导航StackNavigator不起作用。收到错误：“未定义不是对象（正在评估'this.props.navigation.navigate'）”

Question

我正在尝试使用React Navigation和StackNavigator在我的应用程序中导航。

我有一个带有的按钮onPress={() => navigate('DetailsScreen')，我希望它将带我到DetailsScreen，但出现以下错误：

E ReactNativeJS：未定义不是对象（评估“ this.props.navigation.navigate”）

我需要添加什么才能使它正常工作？

在这里查看我的代码：https
:
//gist.github.com/chapeljuice/bef4b0a4dedef2994c81f3634b81aa43

Answer 1

您的组件不支持导航（不是屏幕）。因此，您在这里有2种常见的解决方案：

使用父母

从您的父组件（如果是屏幕）传递导航道具。

<Card navigation={navigation} />

这是最简单的解决方案。

使用高阶组件 withNavigation

如果父组件不支持导航，或者它太复杂而无法传递道具，则可以使用HOC withNavigation：

export default withNavigation(connect(mapStateToProps)(Card))

然后，您将获得navigation道具。