3.1 集成 react-navigation

react-navigation 是一个独立的库，它允许开发人员使用几行代码设置应用程序显示的界面。 官网地址：https://reactnavigation.org/ ，官网提供了详细的教程。

安装

首先需要在项目中安装。 执行

yarn add react-navigation

或者

npm install --save react-navigation

执行完命令在程序的 package.json 中可以看到多了 react-navigation 的依赖，当前使用的是 2.0.0-rc.9 版本。

  "dependencies": {
    "react": "16.3.1",
    "react-native": "0.55.2",
    "react-navigation": "^2.0.0-rc.9"
  }

介绍

react-navigation 包括一些常用的导航器，例如：

• createStackNavigator —— 一次渲染一个屏幕并提供屏幕之间的转换。当一个新的屏幕被打开时，它被放置在堆栈顶部。
• createBottomTabNavigator —— 呈现一个标签栏，让用户在多个屏幕之间切换。
• createSwitchNavigator —— 在一个屏幕和另一个屏幕之间进行切换，并在屏幕上没有UI时卸载屏幕。
• createDrawerNavigator —— 提供从屏幕左侧滑入的抽屉。