一、React 基本知识
首先对 React 进行一个简单的介绍，React 是运用组件化开发思路。最重要的是 render 这个方法（我理解为渲染组件方法）
JSX 语法是 React 的一大特色，允许 HTML 和 JavaScript 的混写
我们用 React.createClass() 创建 React 组件（对象），在组件中 render 方法必须定义
1. React 准备工作
在我们使用 React 之前，需要引入一些库，还需要对 script 标签的 type 做一些修改，才能在浏览器中看到 React 组件
react.js 是 React 的核心库
react-dom.js 提供与 DOM 相关的功能（注：React 组件被插入之前为虚拟 DOM）
browser.js 的作用是将 JSX 语法转为 JavaScript 语法
将 script 标签的 type 属性设置为 text/babel
render 方法返回 HTML 模板，通过 ReactDOM.render() 插入组件
ReactDOM.render() 接受两个参数，第一个为 React 组件，第二个为组件插入的容器
2.React 的生命周期以及生命周期中出现的函数
React 组件有三个状态：Mounted Update Unmounted
Mounted 指的是 React 组件首次 render 的过程
Update 指的是 React 组件被重新 render 的过程
Unmounted 指的是 React 组件被移除的过程
在这里我讲几个用的比较多的函数
在 Mounting 过程中，getInitialState() 方法可以用于定义组件的初始状态（state），在我们与用户交互的时候产生变化的特性，比如我们可以利用 state 初始化组件的样式
componentWillMount() componentDidMount() 这两个函数在 render 方法调用前、后分别调用。可以在页面插入组件前后改变组件的 state （setState() 方法）
3.JSX语法
JSX 的基本语法规则：遇到 HTML 标签（以 < 开头），就用 HTML 规则解析；遇到代码块（以 ｛开头），就用 JavaScript 规则解析
JSX 语法允许直接在模板插入 JavaScript 变量，如果这个变量是一个数组，则会展开这个数组的所有成员（数组成员可以为 HTML 元素）
二、React 组件
React 允许将代码封装成组件，然后像插入普通 HTML 标签一样，在网页中插入这个组件。React.createClass() 方法就用于生成一个组件类。
所有组件都必须有自己的 render 方法，用于输出组件。组件类的第一个字母必须大写。
组件的用法与原生的 HTML 标签完全一致，可以任意加入属性（组件属性用 this.props 对象获取）
组件属性 class 需要用 className 代替，for 用 htmlFor 代替，因为 class 和 for 为 JavaScript 保留字。
1.this.props.children
this.props 对象的属性与组件的属性一一对应，但是有一个例外，this.props.children 表示组件所有子节点。
this.props.children 的值有三种可能：
如果当前组件没有子节点，它就是 undefined；如果有一个子节点，数据类型是 object；如果有多个子节点，数据类型是 array。
React 提供一个工具方法 React.Children 来处理 this.props.children，我们可以用 React.Children 来遍历子节点，而不用担心 this.props.children 的数据类型
2.propsType
组件的属性可以接受任意值，组件类的 PropsType 属性，就是用来验证组件实例的属性是否符合要求。
React.PropTypes.string.isRequired 这个 title 为必须的，而且它的值必须是字符串，如果值不符合会出现 Warning
另外，getDefaultProps 方法可以用来设置组件属性的默认值
3.React 中的 DOM
组件并不是真正的 DOM 节点，而是存在于内存之中的一种数据结构，叫做虚拟 DOM。只有当它插入文档以后，才会变成真实的 DOM。
所有的 DOM 变动，都先在虚拟 DOM 上发生，然后再将实际发生变动的部分，反映在真实的 DOM 上（DOM Diff），极大的提高网页的性能表现
有时需要获取到真实的 DOM 节点，这时就要用到 ref 属性（this.refs.[refName]），等到虚拟 DOM 插入到文档以后才能使用
看到使用较多的方法为 React.findDOMNode(this.refs.[refName])
this.refs.[refName].getDOMNode()，直接使用 this.refs.[refName] 获取也可以
4.this.state
React 将组件看成是一个状态机，一开始有一个初始状态，和用户互动导致状态变化，从而触发重新渲染。
getInitialState() 方法用于定义初始状态，也就是一个对象，这个对象可以通过 this.state 属性读取
当用户与组件互动导致状态变化，this.setState 方法就修改状态值，每次修改以后，自动调用 render 方法渲染组件
this.props 和 this.state 都用于描述组件的特性，一个简单的区分方法： this.props 表示那些一旦定义，就不再改变的特性（如上文的 item），而 state 是会随着用户互动而产生变化的特性。
5.表单
用户在表单填入的内容，属于用户跟组件的互动，应该用 this.state 读取
例子来自阮一峰老师的教程
如文本输入框，需要定义一个 onChange 事件的回调函数，通过 event.target.value 读取用户输入的值
三、实现 todo-list
主要讲一下在实现 todo-list 时，需要注意的地方，详细的请见王福朋老师的教程。
首先进行整体分析：将 TodoList 分为一个总组件和两个子组件，子组件一个输入内容，一个显示内容列表
然后将数据显示到列表中：React 提倡所有的数据都是由父组件管理，通过 props 的形式传递给子组件来处理。针对父组件，用 state 存储（内部信息）；对子组件，数据为外部信息，使用 props。
新增数据：需要让父组件开放一个可以修改数据的接口，然后将接口作为 props 传递给子组件，让其能修改数据（在父组件的子组件中添加属性作为接口）
