react-native 導航器 react-navigation 3.x 使用

React-navigation 介紹

  React Navigation 源於 React Native 社區對一個可擴展且易於使用的導航解決方案的需求，它完全使用 JavaScript 編寫。

安裝

在你的 React Native 項目中安裝 react-navigation 這個包（注意--save或者--save-dev一定要寫正確，鏈接原生庫是會根據package.json文件中的dependencies和devDependencies的記錄來鏈接所有需要鏈接的庫）

yarn add react-navigation
# 或者使用npm
# npm install --save react-navigation

然後安裝 react-native-gesture-handler ，如過你正在使用 Expo ，那麼你可以跳過此步驟，因爲他包含在SDK中，否則

yarn add react-native-gesture-handler
# 或者使用npm
# npm install --save react-native-gesture-handler

鏈接所有原生庫（注意一些老的教程和文檔可能會提到rnpm link命令，此命令已過期不再使用，由下面這個命令代替）

react-native link

此時IOS就不需要其他步驟了，要完成針對Android的react-native-gesture-handler的安裝，請務必對 MainActivity.java 內容進行必要的修改

package com.reactnavigation.example;

import com.facebook.react.ReactActivity;
+ import com.facebook.react.ReactActivityDelegate;
+ import com.facebook.react.ReactRootView;
+ import com.swmansion.gesturehandler.react.RNGestureHandlerEnabledRootView;

public class MainActivity extends ReactActivity {

  @Override
  protected String getMainComponentName() {
    return "Example";
  }

+  @Override
+  protected ReactActivityDelegate createReactActivityDelegate() {
+    return new ReactActivityDelegate(this, getMainComponentName()) {
+      @Override
+      protected ReactRootView createRootView() {
+       return new RNGestureHandlerEnabledRootView(MainActivity.this);
+      }
+    };
+  }
}

混合iOS應用程序（僅針對RN項目跳過）

如果您在混合應用程序（一個同時具有Swift / ObjC和React Native部分的iOS應用程序）中使用React Navigation，您可能會錯過RCTLinkingIOSPodfile中的子規範，該默認情況下會安裝在新的RN項目中。要添加此項，請確保您的Podfile如下所示：

 pod 'React', :path => '../node_modules/react-native', :subspecs => [

　　. . . // other subspecs

　　'RCTLinkingIOS',

　　. . .

]

由於我的項目是基於rn0.55.4版本，react-navigation說0.50以上就可以用，但是安卓無法使用，所以大家還是老實用2.x。