react native基础与入门

一、react native 的优点

1、跨平台(一才两用)

2、低投入高回报 (开发成本低、代码复用率高)

3、性能高:拥有独立的js渲染引擎,比传统的h5+ webview高效

4、支持动态更新(无需每次更新上传到应用市场和审核)

二、使用react native开始项目

1、安装脚手架

npm install -g react-native-cli

2、初始化项目结构

react-native init projectName

3、window下安卓环境配置  地址

注意:如果报错Registry key Error: Java version has value '1.8', but '1.7' is required。你需要把 C:\Windows 下System32文件里里的java.exejavaw.exe and javaws.exe全删了。如果你的操作系统是64位的,你还要再把SysWOW64文件夹里同样删一遍。  参考地址

注意:react-native run-android后,白屏解决方法

方法一:修改手机的应用权限参考链接

方法二:在项目的package.json加如下一句代码:

"bundle-android": "react-native bundle –platform android –dev false –entry-file index.android.js –bundle-output android/app/src/main/assets/index.android.bundle –sourcemap-output android/app/src/main/assets/index.android.map –assets-dest android/app/src/main/res/"

实例:

"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start",
"test": "jest",
"bundle-android": "react-native bundle –platform android –dev false –entry-file index.android.js –bundle-output android/app/src/main/assets/index.android.bundle –sourcemap-output android/app/src/main/assets/index.android.map –assets-dest android/app/src/main/res/"
}

  

注意:报错提示could not get batchedbridge,请看window下安卓环境配置的方法二是否改了,还是有错的话,需要在android\app\src\main添加一个assets空文件夹

react native基础与入门的更多相关文章

  1. React Native基础&入门教程:初步使用Flexbox布局

    在上篇中,笔者分享了部分安装并调试React Native应用过程里的一点经验,如果还没有看过的同学请点击<React Native基础&入门教程:调试React Native应用的一小 ...

  2. React Native基础&入门教程:调试React Native应用的一小步

    React Native(以下简称RN)为传统前端开发者打开了一扇新的大门.其中,使用浏览器的调试工具去Debug移动端的代码,无疑是最吸引开发人员的特性之一. 试想一下,当你在手机屏幕按下一个按钮, ...

  3. 跨平台框架与React Native基础

    跨平台框架 什么是跨平台框架? 这里的多个平台一般是指 iOS 和 Android . 为什么需要跨平台框架? 目前,移动开发技术主要分为原生开发和跨平台开发两种.其中,原生应用是指在某个特定的移动平 ...

  4. React Native基础&入门教程:以一个To Do List小例子,看props和state

    本文由葡萄城技术团队于博客园原创并首发 转载请注明出处:葡萄城官网,葡萄城为开发者提供专业的开发工具.解决方案和服务,赋能开发者. 在上篇中,我们介绍了什么是Flexbox布局,以及如何使用Flexb ...

  5. React Native基础概念和基础认识

    学习地址:https://github.com/vczero/react-native-lesson 当我们初始化一个RN项目的时候主要的是index.ios.js文件和index.android.j ...

  6. React Native 基础报错及解决方案记录

    刚开始上手RN,碰到很多坑,记录一下.碰到问题多去看看github上面的issue! 启动命令react-native run-ios报错 1.:xcrun: error: unable to fin ...

  7. React Native 入门基础知识总结

    中秋在家闲得无事,想着做点啥,后来想想,为啥不学学 react native.在学习 React Native 时, 需要对前端(HTML,CSS,JavaScript)知识有所了解.对于JS,可以看 ...

  8. React Native初探

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

  9. iOS、swift、React Native学习常用的社区、论坛

    <!----iOS> <!----Swift>*IOS开发常用社区:http://code4app.com/ *IOS开发常用社区:http://www.cocoachina. ...

随机推荐

  1. Unity 4.7 导出工程在XCode10.1上编译报错

    Unity 4.7 导出工程在XCode 10.1上编译报错,而在XCode 9.3上是可以正常编译运行的.原因是Unity4.7所依赖的头文件和库文件在XCode10上没有了,解决办法如下,把XCo ...

  2. 随机获取UDID

    (NSString *)uuidString { CFUUIDRef uuid_ref = CFUUIDCreate(NULL); CFStringRef uuid_string_ref= CFUUI ...

  3. 转:SQLServer中的GROUPING,ROLLUP和CUBE

    转自:https://www.cnblogs.com/nikyxxx/archive/2012/11/27/2791001.html 聚集函数:GROUPING 用于汇总数据用的运算符: ROLLUP ...

  4. es6 入坑笔记(三)---数组,对象扩展

    数组扩展 循环 arr.foreach(){ //回调函数 function(val,index,arr){ //val:当前读取到的数组的值,index:当前读取道德数组的索引,arr:当前的数组名 ...

  5. iOS 越狱后 SSH 不能连接

    10.3 越狱之后,装上 OpenSSH, 但是发现连接不上,一直卡着不动,端口是通的,但是就是一直卡着.解决方法是在 Cydia 添加源 http://apt.cydiaba.cn,搜索 Dropb ...

  6. 课时17.WebStorm安装(理解)

    开发工具(工欲善其事,必先利其器) 为了让大家更快的融入到编程的世界中去,不被繁琐的英文单词所困扰,不用每天编写很多没有意义的重复代码,提升大家的开发效率,今后的课程中我们统一采用开发工具来编写网页 ...

  7. Spark SQL join的三种实现方式

    引言 join是SQL中的常用操作,良好的表结构能够将数据分散到不同的表中,使其符合某种规范(mysql三大范式),可以最大程度的减少数据冗余,更新容错等,而建立表和表之间关系的最佳方式就是join操 ...

  8. MySQL数据库实验:任务二 表数据的插入、修改及删除

    目录 任务二 表数据的插入.修改及删除 一.利用界面工具插入数据 二.数据更新 (一)利用MySQL命令行窗口更新数据 (二)利用Navicat for MySQL客户端工具更新数据 三.数据库的备份 ...

  9. 树莓派3B+学习笔记:12、安装FireFox浏览器

    1.在终端中输入 sudo apt-get install iceweasel 2.安装完成后菜单中会自动生成快捷方式 什么是 iceweasel? Iceweasel 是 Firefox(火狐浏览器 ...

  10. python教程(三)·自定义函数

    前面介绍了如何使用函数,这一节我们就来学习怎么创建自己的函数! 自定义函数 创建函数非常简单,它使用关键字 "def",下面的代码创建了一个带有一个参数的函数,并使用不同的参数调用 ...