根据博主 http://www.ruanyifeng.com/blog/2015/03/react.html 的几个Demo（https://github.com/ruanyf/react-demos），持续学习一下React，一款负责UI框架的语言（使用虚拟的DOM，并且将它们储存起来，每当状态发生变化的时候就会创造新的虚拟节点和以前的进行对比，让变化的部分进行渲染。整个过程没有了获取、操作dom节点的步骤，只有一个渲染的过程，所以react就是一个ui框架。）。
首先get了几个sublime的快捷键，非常好用！command+D：选中更多的相同元素；command+control+G：选中所有相同项；command+control+上或下：将整行上移或者下移；control+shift+W:将选中的加上标签。这个几个还需持续练习！另外command+回车是换到下一行（光标在本行中）。
React需要引用的几个JS文件
<script src="../build/react.js"></script>
<script src="../build/react-dom.js"></script>
<script src="../build/browser.min.js"></script>
script标签：
<script type="text/babel"></script> //为什么写text/bable呢，这样可以使用JSX
- ReactDOM.render()方法 html语言可以直接写在里面；
var arr = [
<h1>Hello world!</h1>,
<h2>React is awesome</h2>,
];
ReactDOM.render(
<div>{arr}</div>,
document.getElementById('example')
);
document.getElementById('example') 之后无分号！数组使用[]扩住。
2.React.createClass 方法就用于生成一个组件类
所有组件类都必须有自己的 render 方法，用于输出组件。
render: function() {},
propTypes: {}, /*参数校验*/
XXXX: function(){},
getInitialState: function() {}/*初始态，然后用户互动，导致状态变化，从而触发重新渲染 UI*/
举一个例子
<script type="text/babel">
var Input = React.createClass({
getInitialState: function() {
return {value: 'Hello!'};
},
handleChange: function(event) {
this.setState({value: event.target.value});
},
render: function () {
var value = this.state.value;
return (
<div>
<input type="text" value={value} onChange={this.handleChange} />
<p>{value}</p>
</div>
);
}
}); ReactDOM.render(<Input/>, document.getElementById('example'));
</script>