Learn once, write anywhere: Build mobile apps with React.
1.新建RN项目：
$ react-native init MyProject(项目名称)
确保项目下有node_modules后，运行$react-native run-android来运行项目。
2.RN基本入门及知识点
2.1入口
Android的入口文件是根目录下的index.android.js，Ios的入口文件是根目录下的index.ios.js.
2.2 AppRegistry是JS运行所有React Native应用的入口。应用的根组件应当通过AppRegistry.registerComponent方法注册自己，然后原生系统才可以加载应用的代码包并且在启动完成之后通过调用AppRegistry.runApplication来真正运行应用。
eg: AppRegistry.registerComponent('Helloworld', () => TestComponent);
其中Helloworld是你的项目名称，TestComponent是你的入口组件的名称。
2.3基本组件
常用的基本组件有Button, View, Image, ListVie，Textw等等，这些组件的引入方法是：import {Button，View, Image, ListView} from‘’react-native.
使用方法:
hello world
2.4组件显示的布局（flexBox布局详解）
我们在React Native中使用flexbox规则来指定某个组件的子元素的布局。Flexbox可以在不同屏幕尺寸上提供一致的布局结构。
在组件中的style中指定flexDirection可以决定布局的主轴，子元素是按着水平轴（row）排列，还是数值轴（colum，默认值）排列。flex：定义了元素的可伸缩能力。默认值是0
在组件中的style中指定justifyContent可以决定子元素沿着主轴的排列方式。靠近起始端：flex-start（默认）。 靠近末端：flex-end。 中心：center。space-around和space-between。
在组件的style中指定alignItems可以决定其子元素沿着次轴（与主轴垂直的轴，比如若主轴方向为row，则次轴方向为column）的排列方式。
对应的这些可选项有：flex-start（靠近次轴起始端）、center（次轴中心）、flex-end(次轴末尾段)以及stretch（元素被拉伸以适应容器）。
注意：要使stretch选项生效的话，子元素在次轴方向上不能有固定的尺寸。
使用方法（完整RN Demo）：
2.5自定义组件
自定义组件需要继承React.Component。组件渲染的方法是render（）。最基本的用法是：
class MyComponent extends React.Component{
render() { //这个方法是必须的
Return(); //返回要显示的view最外层只能有一个view
}
}
导出组件：export default（default只能使用一次）MyComponent
导入组件：import MyComponent from‘./XX.js’
export命令规定的是对外的接口，必须与模块内部的变量建立一一对应关系。export，import可以处在任何位置，但必须是在模块顶层。 使用export default时import后不加{}。 若使用export时，import后需要加{}。
2.6自定义样式：
const styles = StyleSheet.create({
XXX,
XXX
});
1.props和state的使用及区别
Props：大多数组件在创建时就可以使用各种参数来进行定制。用于定制的这些参数就称为props（属性）。
以常见的基础组件Image为例，在创建一个图片时，可以传入一个名为source的prop来指定要显示的图片的地址，以及使用名为style的prop来控制其尺寸。
自定义的组件也可以使用props。通过在不同的场景使用不同的属性定制，可以尽量提高自定义组件的复用范畴。只需在render函数中引用this.props，然后按需处理即可。
组件A ->组件B。 组件A中传递的常量（如name），在组件B中可以通过this.props.name来得到。无论是function还是class都不能修改自身的props。
State：我们使用两种数据来控制一个组件：props和state。props是在父组件中指定，而且一经指定，在被指定的组件的生命周期中则不再改变。 对于需要改变的数据，我们需要使用state。
一般来说，你需要在constructor中初始化state，然后在需要修改时调用setState方法。
假如我们需要制作一段不停闪烁的文字。文字内容本身在组件创建时就已经指定好了，所以文字内容应该是一个prop。而文字的显示或隐藏的状态（快速的显隐切换就产生了闪烁的效果）则是随着时间变化的，因此这一状态应该写到state中。
2.constructor（）方法--构造函数
一般构造函数都会先super（props）；
3.方法的定义
function functionName() {
}
在类的内部不使用关键字function
functinName（x, y）{}或者是functionName：（x, y）=> {}（箭头函数）
4.使用导航器实现页面的跳转
StackNavigator
TabNavigator
DrawerNavigator
5.let const var的用法
const只可以初始化常量
var定义变量，若不初始化或输出undeifne，不会报错
let它的作用域是块级，用法类似于var。（for循环中可用let）
6.生命周期
7.Redux
Redux的设计思想很简单，就两句话。
（1）Web应用是一个状态机，视图与状态是一一对应的。
（2）所有的状态，保存在一个对象里面。
react-redux：
React-Redux将所有组件分成两大类：UI组件（presentational component）和容器组件（container component）。
React-Redux提供connect方法，用于从UI组件生成容器组件。connect的意思，就是将这两种组件连起来。
connect方法的完整API如下。
import { connect } from 'react-redux'
const VisibleTodoList = connect(
mapStateToProps,
mapDispatchToProps
)(TodoList)
Provier:
import { Provider } from 'react-redux'
render(
)
这样App下的所有子组件都可以拿到state
10.零散知识点梳理：
（1）...items其中三个点（...）表示扩展运算符。是一个将数组用，分割开的参数序列。
（2）箭头函数：functionName:（x）=>{} === functionName(x) {}
（3）注意this的使用：禁止this指向全局对象。即顶层的this指向undefined。
（4）块级作用域时可以用let代替var
（5）全局常量和线程安全
在let和const之间，建议优先使用const，尤其是在全局环境，不应该设置变量，只应设置常量。
const优于let有几个原因。一个是const可以提醒阅读程序的人，这个变量不应该改变；另一个是const比较符合函数式编程思想，运算不改变值，只是新建值，而且这样也有利于将来的分布式运算；最后一个原因是JavaScript编译器会对const进行优化，所以多使用const，有利于提供程序的运行效率，也就是说let和const的本质区别，其实是编译器内部的处理不同。
const声明常量还有两个好处，一是阅读代码的人立刻会意识到不应该修改这个值，二是防止了无意间修改变量值所导致的错误。
所有的函数都应该设置为常量。
长远来看，JavaScript可能会有多线程的实现（比如Intel的River Trail那一类的项目），这时let表示的变量，只应出现在单线程运行的代码中，不能是多线程共享的，这样有利于保证线程安全。
（6）静态字符串一律使用单引号或反引号，不使用双引号。动态字符串使用反引号。
（7）简单的、单行的、不会复用的函数，建议采用箭头函数。如果函数体较为复杂，行数较多，还是应该采用传统的函数写法。
11.完整的component组成：
limport xxx from‘’
l此处可以定义顶层的常量，function， 或者cla
lexport {xx，xx}
Init class demo:
class ClassDemo extends React.Component {
constructor(props: xxType) {
super(props)
this.state={
name:’hello’,
index:1
}
}
componentWillMount() {}
render () {
return(
return(
this.function1()}/>
);
);
}
componentDidUpdate () {}
function1(){}
function2() {}
}
