未定义不是对象（评估“this.props.navigation.navigate”）答案

【问题标题】：undefined is not an object(evaluating 'this.props.navigation.navigate')未定义不是对象（评估“this.props.navigation.navigate”）
【发布时间】：2018-07-29 08:10:40
【问题描述】：

有人可以帮助我吗？我不断收到错误消息（见标题）。

我知道以前在 StackOverflow 上很多人都问过这个问题。我阅读了他们的答案，但是当我粘贴解决方案时，我仍然遇到此错误。

下面是代码。

非常感谢。

//Jimmy code
import { Navigation } from 'react-native-navigation';
import { StackNavigator } from 'react-navigation';
import { Merchant2 } from "./../Merchant2/Merchant2";

export class Login extends React.Component{

    constructor(prop) {

        super(prop);

        Navigation.events().bindComponent(this);

        this.state = {
          userName: "",
          password: "",
          isVerify: false
        };

         this.onPress=this.onPress.bind(this);

    }

    onPress = () => {

        //const { navigate } = this.props.navigation;
        navigate('Page2');

        alert(1)
    }

     render() {


      navigationOptions = {
        title: 'Results',
      };

        return (
                    <View style={[styles.formFooter]}>
                        <TouchableHighlight style={[commonStyles.alignItemsCenter, styles.loginBtn]}
                                            activeOpacity={1}
                                            underlayColor={'#cdcdcf'}
                                            onPress={this.onPress.bind(this)}
                        >

        );
    };
}

const App = StackNavigator({
  Home: { screen: Merchant2 },
});

export default App;

【问题讨论】：

为什么评论//const { navigate } = this.props.navigation;
嗨，如果我评论这 3 行，我仍然会遇到问题。常量 { 导航 } = this.props.navigation;导航（'Page2'）；警报(1)
导航道具被传递到每个屏幕组件......所以这里它只在你的Merchant2中可用，所以如果你想在Login中使用它，然后像<Login nav={this.props.navigation}/>一样......跨度>

标签： reactjs react-native react-navigation

【解决方案1】：

这里有几件事：

您应该使用名称不同于本机名称的方法，例如“onPress”
如果您没有导航道具，那只是因为您从未在堆栈导航中引用它。在导航对象中指定视图的所有项目都应具有导航道具。
navigationOptions 应该被标记为 static 如果你在你的组件中定义它或者像 Login.navigationOptions。此外，如果您想从您在导航选项中创建的元素的操作中添加导航选项，您可以这样做（在您的组件中）：static navigationOptions = ({navigation}) => ({your navigation options here})

【讨论】：