react 总结

1、React 里直接修改 this.state 和调用 setState() 修改 state 的值有什么区别？

使用对this.state赋值并没有什么作用，官方提醒，应该把this.state当成不可变变量。
而使用this.setState方法，会触发异步修改状态，状态改变的同时，会重新执行一次willUpdate，render等流程。需要注意的是，避免在执行完this.setState后马上读取this.state，此操作并不会获得最新修改的状态。

2、组件渲染

function Welcome(props) {
return <h1>Hello, {props.name}</h1>;
}

const element = <Welcome name="Sara" />;
ReactDOM.render(
element,
document.getElementById('root')
);

1）我们对<Welcome name="Sara" />元素调用了ReactDOM.render()方法。
2）React将{name: 'Sara'}作为props传入并调用Welcome组件。
3）Welcome组件将<h1>Hello, Sara</h1>元素作为结果返回。
4）React DOM将DOM更新为<h1>Hello, Sara</h1>。

3、react-表单-多个输入的解决方法

this.setState({
  [name]: value
});

相当于如下ES5语法

var partialState = {};
partialState[name] = value;
this.setState(partialState);

同样由于 setState() 自动将部分状态合并到当前状态，因此我们只需要使用发生变化的部分调用它。