生命周期

参考:http://wiki.jikexueyuan.com/project/react/component-specs-lifecycle.html

componentWillUpdate

当组件收到新的props或者state，在render之前会回调该函数。
注意不能在该方法中使用 this.setState()，否则会导致无限循环。如果需要在收到新的prop后更新state，应该使用 componentWillReceiveProps 方法，在该方法中使用this.setState()不会触发组件重新渲染。

componentDidUpdate

可以在该方法中使用this.setState()
如果在该方法中使用 this.setState()会更新该组件，更新组件的同时又会触发componentDidUpdate从而重复调用this.setState()，这会导致无限循环。
正确的做法是加入一个终止条件，使得在调用过程中能正确退出

componentDidUpdate: function() {
    if(condition) {
        this.setState({..})
    } else {
        //do something else
    }
}

setState方法详解

• setState方法是异步的并且为了获得更好的性能会进行批量更新,进行setState()操作后state变化不会马上反映到this.state上，所以通过this.state获得的可能还是原来的值。如果想要确保state变化后执行某些操作可以使用setState提供的回调函数setState({...}, function(){})
• setState使用异步操作是因为JS是单线程语言，而更新state是一种比较昂贵的操作，若进行同步操作会导致浏览器卡顿用户体验变差，因此setState采用异步批量更新。
• 若要确保state确实被更新后执行某些操作那么应该使用setState的回调函数

this.setState({...}, function(){
    ...
})