Navigator即导航器，通过导航器我们可以实现应用在不同的页面之间进行跳转。
导航器会建立一个路由栈，用来弹出，推入或者替换路由状态。该路由栈相当于Android原生中使用的任务栈。
renderScene
该方法就相当于我们使用的startActivity方法了，我们可以在该方法中设置需要渲染的场景（跳转的页面），该方法接收两个参数（必要参数），route和navigator，其中route就是路由的页面，navigator是一个Navigator对象，因为Navigator对象拥有pop，push，jump等方法，我们需要导航器对象来实现页面的跳转。而路由route需要我们提前进行配置。
我们来看一下renderScene的使用：
renderScene={(route, navigator) => { let Component = route.component; return <Component {...route.params} navigator={navigator} /> }}
通过上面的方法来实现页面的跳转，同时将导航器作为属性进行传递过去。之前说过，route需要进行配置，通过initialRoute方法来对我们的路由进行初始化，如下所示：
initialRoute={{ name: defaultName, component: defaultComponent }}
initialRoute是一个对象，我们通过给对象设置名称和对应的组件完成route的初始化，即只要传入需要跳转的组件的名称和组建对象，即可在renderScene中完成页面的跳转。
再回头看renderScene方法，route参数就是我们通过initialRoute初始化的对象，我们通过route.component即可获得我们需要渲染（即跳转到）的对象，然后在return的时候返回这个对象完成页面的跳转。为了防止出现问题，我们加上route.component为空的判断，如果不为空，再进行渲染。
renderScene={(route, navigator) => { let Component = route.component; if(route.component){ return <Component {...route.params} navigator={navigator} /> } }}
configureScene
该方法用来设置指定路由对象的配置信息，从而改变场景的动画或者手势。
configureScene={(route) => { //跳转的动画 return Navigator.SceneConfigs.VerticalDownSwipeJump; }}
例如通过如下的方法我们就可以对我们即将要跳转的界面设置跳转动画。
Navigator.SceneConfigs为我们提供了大量的跳转动画，具体可以参考如下文件。
MyProject\node_modules\React-native\Libraries\CustomComponents\Navigator\NavigatorSceneConfigs.js
这样我们就完成了在程序默认页面到我们自定义页面之间的跳转过程。
完整代码如下所示：
'use strict'; import React, { AppRegistry, Component, StyleSheet, Text, Image, TextInput, View, Navigator } from 'react-native'; import FirstPageComponent from './app/src/FirstPageComponent'; export default class MyProject extends React.Component { render() { var defaultName = 'FirstPageComponent'; var defaultComponent = FirstPageComponent; return ( <Navigator //指定了默认的页面，也就是启动app之后会看到的第一屏，需要两个参数，name跟component initialRoute={{ name: defaultName, component: defaultComponent }} configureScene={(route) => { //跳转的动画 return Navigator.SceneConfigs.FadeAndroid; }} renderScene={(route, navigator) => { let Component = route.component; if(route.component){ return <Component navigator={navigator} /> } }} /> ); } } AppRegistry.registerComponent('MyProject', () => MyProject);
其中FirstPageComponent是我们自定义的一个组件，没有添加功能，只放了一个Text，如下所示：
import React,{ View, Text, } from 'react-native'; export default class FirstPageComponent extends React.Component{ constructor(props){ super(props); this.state = {}; } render(){ return ( <View> <Text>我是默认页面</Text> </View> ); } }
如果我们现在想要实现一个从FirstPageComponent到另一个页面之间的跳转，那我们需要怎么做呢？
因为我们之前在页面跳转的时候将导航器对象作为属性传递给了我们的FirstPageComponent，那么我们此时就可以获取这个navigator对象，navigator中有很多方法可以供我们调用进行导航。
首先我们给创建一个可点击的区域包裹Text，这样点击Text就可以触发事件，如下所示，改造render，
render() { return ( <View> <TouchableOpacity onPress={this._pressButton.bind(this)}> <Text>点我跳转</Text> </TouchableOpacity> </View> ); }
我们先不关注TouchableOpacity是什么，只知道他是一片可点击的区域，并且拥有点击事件即可。
然后我们实现_pressButton方法，如下所示：
_pressButtoon(){ const { navigator} = this.props; if (navigator) { navigator.push({ name:'SecondPageComonent', component:SecondPageComonent, }) } }