【react native】react-navigation安装(1)

安装主库
yarn add react-navigation
安装主库依赖的第三方库文件
yarn add react-native-gesture-handler
yarn add react-native-reanimated
yarn add react-native-safe-area-context
yarn add @react-native-community/masked-view
yarn add react-native-screens
根据需要引入各导航组件的库
yarn add react-navigation-stack
yarn add react-navigation-drawer
yarn add react-navigation-tabs
执行pod install
cd ios
pod install
为react-native-screens添加相关依赖

为了在Android上完成安装,还需要在android/app/build.gradle中为react-native-screens添加相关依赖:

implementation 'androidx.appcompat:appcompat:1.1.0-rc01'
implementation 'androidx.swiperefreshlayout:swiperefreshlayout:1.1.0-alpha02'
配置react-native-gesture-handler

为了在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);
+      }
+    };
在index.js or App.js中导入react-native-gesture-handler
import 'react-native-gesture-handler';`在这里插入代码片`
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章