React是由Facebook前端工程师团队开发的一个框架，是因为Facebook对那时已经存在的框架都不太满意，所以就内部开启这个项目，然后在2013年开源。因为React 大部分的操作，都是虚拟 DOM 上发生，所以许多人都认为它仅仅是MVC中的View层，并不算完整的MVC框架。
安装
本地引入
下载链接： http://reactjs.cn/react/downloads/react-15.3.1.zip
因为React使用的是JSX语法，即在Js中直接插入HTML标签。所以还需要一个编译器browser.min.js(这种方式只适合在开发模式下，影响性能以及增加请求次数),然后通过标签引入
通过npm安装
npm i react react-dom --save
引入方式：
var React = require('React');
var ReactDOM = require('React-dom');
组件
在React中，我们可以将每一个功能模块当作是一个组件；
首先，让我们先创建一个组件
var Header = React.createClass({
render:function(){
return (
<div className="header">
<h2 className="title">操作区只有图标的头部</h2>
<span className="regret yo-ico"></span>
<span className="affirm">设置</span>
</div>
)
}
})
注意：每个组件首字母必须大写;类名必须写成className;
module.exports=Header;
然后，再将接口暴露出来。
在这种前提下，其它组件就可以引入并调用;
var Header = require('./module/header.js');
在React中，每个组件只允许有一个根节点。
var App = React.createClass({
render:function(){
return (
<div>
<Header/>
<Footer/>
</div>
)
}
})
最后，在Dom中渲染出来。
ReactDOM.render(<App/>,document.getElementById('app'));
生命周期
React中有3个阶段的生命周期：
加载阶段
- getDefaultProps
设置默认属性 - getInitialState
设置初始状态值 - componentWillMount
组件将要进行加载 - render
渲染阶段 - componentDidMount
组件加载完成
更新阶段
- componentWillReceiveProps
组件即将接收属性时 - shouldComponentUpdate
组件是否要更新（必须返回Boolean值，否则报错） - componentWillUpdate
组件将要进行加载 - render
必不可少的渲染阶段 - componentDidUpdate
组件更新完成
卸载阶段
- componentWillUnmount
组件卸载前
单向数据流
React中每次改变数据，都在重新渲染整个DOM。但React中有Diff算法，它将不更新的组件排除；
根据React写的一个小Demo：
1.gif
