React Native 在配置react-navigation時會出現(xiàn)這個問題，在模擬器和真機上面都會出現(xiàn)了以下錯誤，后來發(fā)現(xiàn)react-navigation官網(wǎng)上解決方法，在此記錄：
Cannot read property 'Direction' of undefined
解決方法如下：
1 、react-navigation在React Native項目中安裝包。

yarn add react-navigation //下載可以按照需要版本下載 yarn add react-Navigation@3.12.1
# or with npm
# npm install --save react-navigation

React Navigation由一些核心實用程序組成，然后導航器使用這些實用程序在您的應用程序中創(chuàng)建導航結(jié)構(gòu)?，F(xiàn)在不要太擔心這個，它很快就會變得清晰！要預先安裝工作，我們還要安裝和配置大多數(shù)導航器使用的依賴項，然后我們可以繼續(xù)開始編寫一些代碼。

我們現(xiàn)在要安裝的庫是react-native-gesture-handler和react-native-reanimated。如果您已經(jīng)安裝了這些庫并且安裝了最新版本，那么您就完成了！否則，請繼續(xù)閱讀。

將依賴項安裝到Expo托管項目中

在項目目錄中，運行expo install react-native-gesture-handler react-native-reanimated。這將安裝兼容的這些庫的版本

您現(xiàn)在可以繼續(xù)“Hello React Navigation”開始編寫一些代碼。

將依賴項安裝到一個簡單的React Native項目中

在項目目錄中，運行yarn add react-native-reanimated react-native-gesture-handler react-native-screens。

接下來，我們需要鏈接這些庫。步驟取決于您的React Native版本：

• React Native 0.60及更高版本

  在較新版本的React Native上，鏈接是自動的。

  要在iOS上完成鏈接，請確保已安裝Cocoapods。然后運行：

  cd ios
  pod install
  cd ..

• React Native 0.59及更低版本

  如果您使用較舊的React Native版本，則需要手動鏈接依賴項。為此，請運行：

  react-native link react-native-reanimated
  react-native link react-native-gesture-handler
  react-native link react-native-screens
  
  

要完成安裝react-native-screens的Android，下面兩行添加到dependencies節(jié)中android/app/build.gradle：

implementation 'androidx.appcompat:appcompat:1.1.0-rc01'
implementation 'androidx.swiperefreshlayout:swiperefreshlayout:1.1.0-alpha02'

要完成react-native-gesture-handlerAndroid的安裝，請進行以下修改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);
+      }
+    };
+  }
}

本文來自：react-navigation官網(wǎng)