ReactJs v16 学习新知-生命周期

constructor

声明super(props)，下文中才能正常使用this.props
初始化this.state={}

componentWillMount

在render()之前执行，不适合设置setState()

componentDidMount

1. 获取远程数据；
2. 定制事件监听； 
3. setState可以触发render更新又不会影响视觉体验（和size、position不相关的）

componentWillReceiveProps(nextProps)

当父级元素触发子级元素的重新渲染时执行；
判断props有改变时再刷新使用this.props 和 nextProps 判断后，再设置setState

shouldComponentUpdate(nextProps, nextState)

默认是每次都触发render更新；
可以通过比较this.props 和 nextProps 与 this.state 和 nextState 返回 false，阻止默认的执行行为；
不推荐使用深层次比较和 JSON.stringify()在这里进行比较

componentWillUpdate(nextProps, nextState)

不能使用this.setState()；
shouldComponentUpdate返回false时就不执行这个了

componentDidUpdate(prevProps, prevState)

当props改变时可以在此进行网络请求

componentWillUnmount()

取消事件监听；取消网络请求；

componentDidCatch(error, info)

输出错误信息

setState(updater[, callback])

setState并不总是立即执行，会成批或者推迟执行，所以要想正确获取到this.state,可以在 componentDidUpdate 或者 setState callback中获取；   setUpdate只有在shouldComponentUpdate返回false时不会触发重新渲染； (prevState, props) => stateChange

this.setState((prevState, props) => {
  return {counter: prevState.counter + props.step};
});

component.forceUpdate(callback)

render() 中使用 forceUpdate() 修改 state 而跳过 shouldComponentUpdate()，但是子组件依然执行 shouldComponentUpdate ，但不推荐使用。

defaultProps

设置默认props，当没有设置props起作用，为null时依然为null

props

this.props.children是组件包含的内容，不是组件自身的标签

state

改变state用setState