React Native框架介绍

一、环境搭建

       1. 安装node.js,并配置环境变量(node -v)

       2. 安装npm,(node.js集成了npm,无需安装,npm -v)

       3. 安装python,并配置环境变量(python -v)

       4. 安装react native命令行工具: npm install -g react-native-cli

       5. 安装webstorm

       配置pathon环境变量如下图:

  其他环境变量设置如下图:

二、创建工程

      1. 创建react-native android项目:react-native init MyProject

      2. 启动react-native服务:在项目文件夹下 react-native start

      3. react-native run-android(cmd管理员权限,真机上运行设置Dev Settings)

      注意事项:在真机上运行工程,会出现以下错误:

解决办法:手机摇一摇,或者通过系统菜单,打开调试菜单,如下图:

  点击最后一项:Dev Settings,如下图所示,配置上本机的ip地址和端口号,端口号固定为8081。然后点击确定,打开上图的调试菜单,点击Reload JS即可。

三、React Native组件生命周期

详细介绍地址:http://www.race604.com/react-native-component-lifecycle/

四、其他资料

1. React Native官方网站

      (1) react native英文官网:   https://facebook.github.io/react-native/docs
      (2) react native中文官网:http://reactnative.cn/docs/0.47/getting-started.html

2. ES6语法

       (1)阮一峰ES6简介: http://es6.ruanyifeng.com/#docs/intro

      (2)React/React Native的ES5与ES6语法对照表:http://bbs.reactnative.cn/topic/15/react-react-native-%E7%9A%84es5-es6%E5%86%99%E6%B3%95%E5%AF%B9%E7%85%A7%E8%A1%A8/4

3. Flex布局

阮一峰Flex布局教程:http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html



你可能感兴趣的:(native,react,native,react,native框架介绍)