好久没写博客了,特地把之前接触React Native时遇到的坑总结一下。

  初始化一个React Native项目时,可能会遇到以下这些坑:

  1、项目版本号与安卓模拟器中安装的 compileSdkVersion 和 buildToolsVersion 版本不一致,这时候可以直接修改 项目 => android => app => build.gradle文件下的版本号,如下:

  

  

  2、初始化一个项目并运行项目时,可能会一直报错,这时有可能是因为缺少 local.properties文件,该文件用于指定 SDK的路径(该文件存放在项目目录下 => android 下)

  文件内容如下:

   sdk.dir=C\:\\Users\\android\\AppData\\Local\\Android\\sdk (这是我的sdk安装路径)

  3、可能会出现React Native与javascript版本号不一致,这时候可以新建一个与javascript版本号一致的React Native项目,命令如下: 

react-native init 项目名 --version 具体的版本号

  

  4、有时候运行会出错,报错类似"Cannot add a child that doesn't have a YogaNode or parent node" 这种,有可能是因为render方法中含有注释语句,这时候删除注释语句,可能就会正常运行了。

  

  5、文本放在Text标签中,不要直接放在View标签中(View是一个容器,用来包含其他的标签的),否则模拟器可能会直接崩了(亲测,android studio和genymotion下都崩了,当然也可能是我的版本的原因)

  6、当我们执行点击事件,如onPress时,希望在点击后显示高亮状态,这时候就可以使用TouchableHighlight组件了,但是,注意:该组件只能包含一个子节点,否则会出错,如果希望它包含多个节点,那么可以在它里面嵌套一个View(默认情况下TouchableHighlight组件在点击时会出现一个黑背景,且标签大小可能会有所改变,要解决该问题,可以使用属性underlayColor,将其值设为白色(‘#fff’))

  7、在使用导航组件react-navigation时,使用yarn来安装(yarn add react-navigation),用npm安装的话可能会存在许多未知错误(更不要使用cnpm)

关于React Native的那些坑的更多相关文章

  1. react native遇到的坑

    1.模拟器报错no bundle url present https://github.com/facebook/react-native/issues/12754 http://www.cnblog ...

  2. 初识React Native,踩坑之旅....

    开启Genymotion Android模拟器后 1.运行“react-native run-android”报端口冲突....解决方法: 2.运行“react-native run-android” ...

  3. react native 遇到的坑

    1.项目中新加入组件,应执行npm install命令 2.项目执行react-native run-android 报错,应进入android目录,执行gradlew.bat clean命令 3.L ...

  4. 记录VSCode开发React Native的一些坑

    当我们点Debug Android时,会弹出以下错误 Could not debug. Unable to set up communication with VSCode react-native ...

  5. React Native初探

    前言 很久之前就想研究React Native了,但是一直没有落地的机会,我一直认为一个技术要有落地的场景才有研究的意义,刚好最近迎来了新的APP,在可控的范围内,我们可以在上面做任何想做的事情. P ...

  6. React Native指南汇集了各类react-native学习资源、开源App和组件

    来自:https://github.com/ele828/react-native-guide React Native指南汇集了各类react-native学习资源.开源App和组件 React-N ...

  7. 给所有开发者的React Native详细入门指南

    建议先下载好资料后,再阅读本文.demo代码和资料下载 目录 一.前言 二.回答一些问题 1.为什么写此教程 2.本文适合哪些人看 3.如何使用本教程 4.需要先学习JavaScript.HTML.C ...

  8. 为什么学习React Native三点原因

    React Native不到两岁,兼容Android平台刚刚1年.我学习React Native其实也就不到1年,不算长,也不算短. Paul Graham在文章中写过:大多数人真正注意到你的时候,不 ...

  9. React Native拆包及热更新方案 · Solartisan

    作者:solart 版权声明:本文图文为博主原创,转载请注明出处. 随着 React Native 的不断发展完善,越来越多的公司选择使用 React Native 替代 iOS/Android 进行 ...

随机推荐

  1. rm 命令详解

    rm  作用: 删除一个目录中的一个或多个文件或目录,也可以将某个目录及下属的所有文件及子目录均删除掉, 对于连接文件只是删除整个连接文件,而保持原有文件. 注意: 使用rm 命令要格外小心,因为一旦 ...

  2. 比较日期大小以及获取select选中的option的value

    原生JavaScript如何获取select选中的value // 1. 拿到select对象 const selectObject = document.getElementById('test') ...

  3. 编译TensorFlow源码

      编译TensorFlow源码 参考: https://www.tensorflow.org/install/install_sources https://github.com/tensorflo ...

  4. BeanShell断言(一)

    在beanShell中直接可以调用的变量,无需加前缀. 1.log 打印日志 log.info(“在控制台打印日志”); 2.SampleResult 获取SampleResult对象,可以通过这个对 ...

  5. ubuntu 安装 pythonenv

    This will get you going with the latest version of pyenv and make it easy to fork and contribute any ...

  6. SQL基础学习_02_查询

    SELECT语句 1. SELECT语句查询列(字段):     SELECT <列名>    FROM <表名>;     该语句使用了两个SQL子句,SELECT子句列举了 ...

  7. 解决 axios 返回空对象的问题

    问题描述:

  8. Python day 7(1) 模块

    一:模块 1 在Python中,一个.py文件就称之为一个模块(Module) 2 Python的好处,优点: a  提高了代码的可维护性 b  当一个模块编写完毕,就可以被其他地方引用.我们在编写程 ...

  9. Android OpenGL ES 入门系列(一) --- 了解OpenGL ES的前世今生

    转载请注明出处 本文出自Hansion的博客 OpenGL ES (OpenGL for Embedded Systems) 是 OpenGL 三维图形 API 的子集,针对手机.PDA和游戏主机等嵌 ...

  10. ubuntu16编译安装mysql5.7

    安装环境: linux版本: ubuntu-16.04.3-desktop-amd64 mysql版本:mysql-boost-5.7.20.tar.gz 下载地址:https://dev.mysql ...