本文基于React Native 0.52

一、创建一个项目

1、初始化一个RN项目

react-native init RNDemo

2、连接一个设备或是打开模拟器

可以通过 adb devices 查看连接的设备,如下图:

3、进入RNDemo目录下,运行项目

cd RNDemo
react-native run-android

运行成功如下图:

二、项目目录

  • app文件夹 —— 自己创建的,自己写的页面都放在这里面
  • App.js —— 整个应用的根容器
  • index.js —— 在这里面将App这个组件注册为了根容器

三、调试

手机摇一摇,会出现如下选项 (Developer Menu):

  • Reload —— 重新加载
  • Debug JS Remotely —— 启动JS远程调试,浏览器会自动打开一个页面,可以在这里进行一些调试,如下图

  • Enable Hot Reloading —— 打开这个,每次保存都会加载

END-------------------------------------------------------------------

下篇写一下怎么用导航器navigation跳转页面 (#^.^#)

React Native学习(二)—— 开始一个项目的更多相关文章

  1. React Native学习(二)之View

    React Native组件解析(二)之View 0.JSX React的核心机制之一就是虚拟DOM:可以在内存中创建的虚拟DOM元素.React利用虚拟DOM来减少对实际DOM的操作从而提升性能. ...

  2. React Native技术做的一个项目“微笑阅读”

    最近用React Native做了一个APP应用,有点心得: React Native确实比Hybrid应用渲染快,响应快,用户体验更好: React Native比原生简单多了,会Js就可以了,开发 ...

  3. React Native 学习笔记--进阶(二)--动画

    React Native 进阶(二)–动画 动画 流畅.有意义的动画对于移动应用用户体验来说是非常必要的.我们可以联合使用两个互补的系统:用于全局的布局动画LayoutAnimation,和用于创建更 ...

  4. 将React Native 集成进现有OC项目中(过程记录) 、jsCodeLocation 生成方式总结

    将RN集成到现有OC项目应该是最常见的,特别是已经有OC项目的,不太可能会去专门搞个纯RN的项目.又因为RN不同版本,引用的依赖可能不尽相同,所以特别说明下,本文参考的文档是React Native ...

  5. 深入浅出React Native 3: 从零开始写一个Hello World

    这是深入浅出React Native的第三篇文章. 1. 环境配置 2. 我的第一个应用 将index.ios.js中的代码全部删掉,为什么要删掉呢?因为我们准备从零开始写一个应用~学习技术最好的方式 ...

  6. react native 学习一(环境搭配和常见错误的解决)

    react native 学习一(环境搭配) 首页,按照http://reactnative.cn/docs/0.30/getting-started.html#content上的介绍,下载安装pyt ...

  7. React Native 学习-01

    React Native 学习 (学习版本 0.39) 一.环境配置 二.IDE选择 webstorm 1.webstorm配置 ①.首先是可以选择使用汉化包汉化.eu68 ②.安装插件和外部库. 由 ...

  8. React Native 学习资料

    React Native 学习资料 学习资料 网址 React Native中文网 https://reactnative.cn/

  9. React Native 学习(三)之 FlexBox 布局

    React Native 学习(三)之 FlexBox 布局

随机推荐

  1. 解决 ASP.NET Core Hangfire 未授权(401 Unauthorized)

    相关文章:ASP.NET Core 使用 Hangfire 定时任务 ASP.NET Core Hangfire 在正式环境发布之后,如果访问 http://10.1.2.31:5000/hangfi ...

  2. Linux下查看Go语言软件运行情况

    在Linux下,使用"jps"可以查看用Java语言写的软件的运行情况,如果要查看GO语言写的软件的运行情况,可以使用"gops",但这不是系统自带的,需要进行 ...

  3. Laravel学习笔记(二)

    解决了类自动加载的问题,剩下的问题就是看文档了,laravel的官方文档虽然简单,但是却包含了很多基础知识,学习Laravel最好先看看官方文档,我感觉帮助很大,因为laravel框架的源码看起来并不 ...

  4. 【CSS3】透明度opacity与rgba()区别、光标cursor、display、轮廓outline与margin及border区别、em和rem区别

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  5. 【MySQL】查看支持的字符集show character set;

  6. 【python】字符串

    >>> str1="welcom to China">>> str1[2:4]'lc'>>> str1[7]'t'>&g ...

  7. OC学习7——类别、扩展和协议

    1.我么在调用NSLog()方法打印一个对象时,实际上是调用了该对象的description方法,这个description方法就和Java中的toString()方法一样.所以,下面两行代码其实是一 ...

  8. iOS 控制器的跳转、页面四个方向的跳转

    指定滑动方向的跳转 CATransition *transition = [CATransition animation]; transition.duration = 0.3f; transitio ...

  9. iOS ShareSDK 三方分享/登录使用

    原文 http://www.cnblogs.com/CoderAlex/p/4860352.html 一: 快速集成 1.前言 作为现在App里必不可少的用户分享需要,社交化分享显然是我们开发app里 ...

  10. 每周.NET前沿技术文章摘要(2017-05-10)

    汇总国内外.NET社区相关文章,覆盖.NET ,ASP.NET和Docker容器三个方面的内容: .NET Debugging .NET core with SOS everywhere 链接:htt ...