这两个点是react入门非常重要的两个点，以前我们是直接操作dom的形式去做，react的设计思想和以前直接操作dom是完全不同的，react是一个响应式的框架，他在做编程的时候，强调的是我们不要直接操作dom。我们操作的是数据，通过数据的变化，react会自动感知到数据的变化，自动的帮你去生成dom。所以在写代码的时候，我们再也不用关注dom相关的操作了。我们只需要关注数据层的就可以了。
在react中如何定义数据呢？我们应该这么定义，TodoList这个组件，或者说他是一个类，在js里面
import React, {Component, Fragment} from 'react';
class TodoList extends Component{
constructor(props) {
super(props);
this.state = {
inputValue: 'hello!!!',
list: []
}
}
render(){
return (
<Fragment>
<div>
<input
value = {this.state.inputValue}
onChange = {this.handleInputChange.bind(this)}/>
<button> 提交 </button>
</div>
<ul>
<li>学英语</li>
<li>learn react</li>
</ul>
</Fragment>
)
}
handleInputChange(e) {
this.setState({
inputValue: e.target.value
})
}
}
export default TodoList;
一个类就一定会有个constructor构造函数，当我们去创建一个todolist实例或者当我们去使用组件的时候，constructor这个构造函数，会由于其它任何函数，会自动的最先被执行的一个函数，所以constructor是最优先执行的一个函数，constructor有一个固定的写法，会接收一个叫做props的参数。
super(props); 他的意思是什么？我的Todolist组件继承了React.Component这个组件，所以super指的是父类，也就是Component这个类。我要调用父类的构造函数，调用一次，这是js里面继承经常要做的一件事情。在react里面，如果写构造函数，都是要写这两句代码的。一个是接收props参数，一个是调用super这个方法，他是固定的一个写法。
主要是下面的定义数据，react里面定义数据，我们需要把数据定义在状态里面。this.state就是这个组件的状态，这个状态里面就可以存很多的东西。我们把input里面的value跟inputValue相关联，这样inputValue值变了， react会自动感知到，然后赋值给value。所以React之所以起名叫做React,就是这个原因，react在英文中是响应的意思。如果input的value=this.state.inputValue，在界面上怎么输都是inputValue的初始值，为什么？数据不发生改变，页面的值就不会发生改变，显然，这是不对的，我们希望input框可以接收我们的输入，input框可以绑定一些原生事件，比如onChange去监听他的变化。
在react中，如果想要改变react的状态，不能通过this.state这种引用的方式去改变他的值。react给每一个组件提供了一个方法，这个方法是setState,