React Navigation 路由導航庫升級 5.x

當前版本：3.0.0

升級版本：5.12.8

 

安裝依賴

 

$ yarn add   @react-navigation/native   @react-navigation/stack   @react-navigation/bottom-tabs   react-native-reanimated   react-native-gesture-handler   react-native-screens   react-native-safe-area-context   @react-native-community/masked-view

 

上述依賴中按照當前項目進行合理安裝即可

 

修改範圍

react-native-gesture-handler

在入口文件的頂部進行初始化:

import 'react-native-gesture-handler'

createAppContainer

在 React Navigation 5 中，已經沒有用於提供導航上下文的 createAppContainer 了。現在需要 NavigationContainer 包裝。

import {  NavigationContainer  } from '@react-navigation/native';

createStackNavigator

在 React Navigation 3 中，我們通過靜態方式調用 createStackNavigator 來配置 navigator，其中，第一個參數是包含路由信息的對象，第二個參數是 navigator 的配置 options。在  React Navigation 5 中：<