undefined is not an object (evaluating 'this.props.nav.push')的解决过程

说明：刚接触react native不到两个星期，这两天在做页面跳转的时候遇到了这个问题（头疼了两天）。刚刚终于解决了，先把解决过程记录下来

1、当前react native的最新版本是0.47，因此Navigator需要从react-native-deprecated-custom-components中引入（见官方文档）

，代码如下：

import {Navigator} from 'react-native-deprecated-custom-components'

2、但是在运行项目的时候，总是提示错误：undefined is not an object (evaluating 'this.props.nav.push')。在查到的解决方案主要有一下三种：

方案一：将函数自动绑定this对象

方案二：在constructor函数上进行this绑定

方案三：使用Es6的箭头函数

但是经过测试都以失败告终，更准确的说法是不是失败，而是还没有找到解决问题的关键。

3、要想解决这个问题，关键是要找到'this.props.nav.push'这个提示中哪个是undefined：

goToAboutUs() {
    let navigator = this.props.nav;
    Alert.alert('Button clicked  ' + navigator);
    if (navigator) {
        navigator.push({
            id: 'aboutUs',
            title: 'aboutUs',
        });
    }
}

经过这个可以找到“nav”是undefined的

4、如此一来这个问题就很好解决了，找到nav最开始出现的地方（按照页面嵌套或者引用），最终在注册跳转组件的方法里：

static _renderPage(route, nav) {
    switch (route.id) {
        case 'main':
            return (<MainScreen nav={nav}/>);
            break;
    }
}

这样，只要将这个“nav”通过页面引用传递到需要的页面，这个问题就会解决。在组件MainScreen中可以这样传递到Mine页面中：

<Mine nav={this.props.nav}/>

然后就可以在Mine页面中使用了：

<Button
    onPress={() => this.props.nav.push({
        id: 'aboutUs',
        title: 'aboutUs',
    })}
    title="AboutUs"
/>

第一次写博客，互相学习，不足之处敬请谅解！