一、非约束性组件
针对<input>输入框这种类型，你可以通过这种方式来实现（其中defaultValue就是原生DOM中的value属性。
<input type="text" defaultValue="a" ref="input"/>
获取输入框的值的时候，需要这样做——即通过查询DOM，获取DOM属性的方式来做。
var input = this.refs.input
console.log(input.value)
这样做，和jquery的做法一样，都是围绕着DOM来做的。缺点有两个：
- 依赖DOM操作，不符合组件化的设计，也不易扩展
- 查询DOM消耗更多性能。
二、约束性组件
比较推荐的方式是这一种。即监控<input>的变化，将值实时保存到state中，直接从state中获取值。
<input type="text" value={this.state.name} onChange={this.handleChange} />
//...省略部分代码
handleChange: function(e) {
this.setState({
name: e.target.value
});
}
<b>React或者Vue都是一种基于数据驱动视图的设计方式，定好数据和视图的规则之后，只更改数据，不直接操作DOM。操作DOM的事情，交给React或者Vue这个框架的代码来搞定。</b>
