一、安装依赖,使用npm或yarn命令,3.x版本必须安装react-native-gesture-handler

react-navigation
react-native-gesture-handler

二、 配置react-native-gesture-handler,可以执行如下命令

react-native link react-native-gesture-handler

android执行此命令,有时候会没有效果,需要检查核实

  • 查看android/settings.gradle
  • 查看android/app/build.gradle
  • 查看android/app/src/main/java/com/projectname/MainActivity.java和MainApplication.java
//settings.gradle
include ':react-native-gesture-handler'
project(':react-native-gesture-handler').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-gesture-handler/android') //app\build.gradle
implementation project(':react-native-gesture-handler') //MainApplication.java import com.swmansion.gesturehandler.react.RNGestureHandlerPackage; public class MainApplication extends Application implements ReactApplication { private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) {
... @Override
protected List<ReactPackage> getPackages() {
return Arrays.<ReactPackage>asList(
new MainReactPackage(),
new RNGestureHandlerPackage()
);
} ...
}; //MainActivity.java
import com.facebook.react.ReactActivityDelegate;
import com.facebook.react.ReactRootView;
import com.swmansion.gesturehandler.react.RNGestureHandlerEnabledRootView; public class MainActivity extends ReactActivity { ... @Override
protected ReactActivityDelegate createReactActivityDelegate() {
return new ReactActivityDelegate(this, getMainComponentName()) {
@Override
protected ReactRootView createRootView() {
return new RNGestureHandlerEnabledRootView(MainActivity.this);
}
};
}
}

三、 undefined is not an object (evaluating 'RNGestureHandlerModule.State')

  以及 undefined is not an object (evaluating 'RNGestureHandlerModule.Direction')

相关错误都是因为react-native-gesture-handler没有配置好  

react-navigation 3.x版本的安装以及react-native-gesture-handler配置的更多相关文章

  1. React Navigation / React Native Navigation 多种类型的导航结合使用,构造合理回退栈

    React Navigation 更新到版本5已经是非常完善的一套导航管理组件, 提供了Stack , Tab , Drawer 导航方式 , 那么我们应该怎样设计和组合应用他们来构建一个完美的回退栈 ...

  2. 史上最全Windows版本搭建安装React Native环境配置

    史上最全Windows版本搭建安装React Native环境配置 配置过React Native 环境的都知道,在Windows React Native环境配置有很多坑要跳,为了帮助新手快速无误的 ...

  3. 史上最详细Windows版本搭建安装React Native环境配置 转载,比官网的靠谱亲测可用

    史上最详细Windows版本搭建安装React Native环境配置   2016/01/29 |  React Native技术文章 |  Sky丶清|  95条评论 |  33530 views ...

  4. React Native常用组件之TabBarIOS、TabBarIOS.Item组件、Navigator组件、NavigatorIOS组件、React Navigation第三方

    以下内容为老版本React Native,faceBook已经有了新的导航组件,请移步其他博客参考>>[我是传送门] 参考资料:React Navigation  react-native ...

  5. React-native 导航插件React Navigation 4.x的使用

    React-native 导航插件React Navigation 4.x的使用 文档 英文水平可以的话,建议直接阅读英文文档 简单使用介绍 安装插件 yarn add react-navigatio ...

  6. React文档翻译系列(一)安装

    原文地址:原文 本系列是针对React文档进行的翻译,因为自己在学习react的时候,最开始通过看博客或者论坛等中文资料,有些内容是零零散散的接收,并没有给自己带来很好的效果,所以后来决定把文档的原文 ...

  7. react-native 学习 ----- React Navigation

    很久没有的登陆博客园了,密码都是找回的,从当年的大学生已经正常的走上了程序员的道路,看到之前发的博客还是写的android,现在自己已经在使用了react-native了. 大学毕业了,做了java后 ...

  8. [RN] 04 - React Navigation

    react-navigation和react-router的对比: 支持的平台: react-navigation: react-native react-router: react-native.r ...

  9. React官方中文文档【安装】

    https://reactjs.org/docs/getting-started.html  //React官方文档地址 1.入门 此页面是React文档和相关资源的概述. React是一个用于构建用 ...

随机推荐

  1. scikit-learn 学习笔记-- Generalized Linear Models (三)

    Bayesian regression 前面介绍的线性模型都是从最小二乘,均方误差的角度去建立的,从最简单的最小二乘到带正则项的 lasso,ridge 等.而 Bayesian regression ...

  2. 关于数据库SQL语句的编写规范与tips

    1. 插入数据时,建议使用如下B(指定字段名称赋值)的形式 A. update ${table} values('a','b','c;): B. update ${table} set (a,b,c) ...

  3. 图形学习 Javascript 正则 regexper.com

    regexper.com 可以很方便的显示出正则图示,方便学习正则. 比如正则 ^([a-zA-Z0-9+_-])+@([a-zA-Z_-])+(\.[a-zA-Z0-9_-])+ 一目了然,直观显示 ...

  4. 【python】FTP客户端

    Python中默认安装的ftplib模块定义了FTP类,其中函数有限,可用来实现简单的ftp客户端,用于上传或下载文件,函数列举如下 ftp登陆连接 from ftplib import FTP #加 ...

  5. .NET 4.5 HttpClient 中使用Cookie

    为了使用.NET 4.5的HttpClient从WIN2K3换成了WIN7.装VS2010,结果告诉我VS2010不支持.NET 4.5.又装VS2012,接着装.NET FRAMEWORK 4.5. ...

  6. Android之NFC

    来源:http://blog.csdn.net/bear_huangzhen/article/details/46333421 NFC简介: Near Field Communication 近场通信 ...

  7. bzoj4891: [Tjoi2017]龙舟

    求$\frac{b_1b_2b_3...b_m}{a_1a_2a_3...a_m}\%M$ M<=1e18,m<=100000,数据组数<=50 用pollard-rho分解M的质因 ...

  8. Java 迭代器 Iterator

    迭代器模式 迭代器模式(Iterator Pattern)是 Java 和 .Net 编程环境中非常常用的设计模式.这种模式用于顺序访问集合对象的元素,不需要知道集合对象的底层表示. 迭代器模式属于行 ...

  9. [Android] 开发第七天

    在另一台机器上安装 Android-Studio ,结果卡在了 Gradle 的下载界面上,网上各种方案都试了一遍,最终解决办法是: 然后新建了一个 App ,创建了新的签名并上传到手机上,安装时直接 ...

  10. Charles 3断点篡改数据

    只是临时修改一次网络请求结果,使用重写过于麻烦.对于临时性的修改,最好使用断点. 断点功能主要修改requess和response内容,这个时候接口是在Charles代理层被拦截,还未到手机设备上. ...