React Navigation - Navigators

Navigators允许你定义你应用的导航框架，Navigators也会渲染通常的控件，包括headers、tab bars，而且可配置。实际上，navigators是React朴素(plain)的控件。

内置Navigators

react-navigation 包含以下方法来帮你创建navigators:

• StackNavigator - 每次渲染一屏，提供过场动画。当打开新页面时，将其加入栈顶。
• TabNavigator - 渲染一个标签栏来让用户在几个屏幕间切换。
• DrawerNavigator - 提供一个从屏幕左边划入的抽屉栏

使用Navigators来渲染屏幕

navigators渲染的只是React的组件，阅读以下内容学习如何创建屏幕(screen)：

• Screen navigation prop 允许屏幕分发导航action，例如打开另一屏
• Screen navigationOptions 定制屏幕如何展现，如顶部标题、tab标签等

在顶级控件调用Navigate

如果你想在定义navigator的同级控件中使用它，可以用ref选项

const AppNavigator = StackNavigator(SomeAppRouteConfigs);

class App extends React.Component {
 someEvent() {
   // call navigate for AppNavigator here:
   this.navigator && this.navigator.dispatch({ type: 'Navigate', routeName, params });
 }
 render() {
   return (
      { this.navigator = nav; }} />
   );
 }
}

注意：此解决方案只能用在navigator的顶级中。

导航容器

当navigation prop缺失时，内置的navigators可以自动成为顶级的navigators。这个功能提供了一个透明的navigation容器，作为顶级navigation prop的来源。

当渲染其中一个navigator时，navigation prop是可选的。当缺失时，容器介入并管理它自己的导航状态。他也集成了处理URLs，外联以及安卓的back键的功能。

为了方便的目的，内置的navigators有这样的能力，因为在底层，他们使用createNavigationContainer。通常，navigators为了运行需要一个navigation prop。

顶级的navigators接受如下属性：

onNavigationStateChange(prevState, newState, action)

这个方法在每次导航状态变化时都会调用。它接受到的参数是上一个状态、新状态以及使状态发生变化的action。默认会在控制台打印状态变化的log。

uriPrefix

URIs的前缀app可能会处理。当处理 deep link 时会用来提取路由用到的路径