共计 774 个字符，预计需要花费 2 分钟才能阅读完成。
完整生命周期
constructor(props) // 初始化参数
componentWillMount()
render() // 第一次渲染
componentDidMount()
当父组件向子组件传入 props 发生改变后，依次调用
componentWillReceiveProps(nextProps)
shouldComponentUpdate(nextProps, nextState)
componentWillUpdate()
render() // 子组件更新渲染
componentDidUpdate()
当组件自身 state 发生变化后
componentWillUpdate()
render() // 组件再次更新渲染
componentDidUpdate()
当组件卸载
componentWillUnmount()
生命周期详解
componentDidMount() 此处请求接口数据
componentWillReceiveProps(nextProps) 子组件获得新 props 时触发，作用是在子组件再次渲染前，更新子组件自身的 state，之后会触发 shouldComponentUpdate()
shouldComponentUpdate(nextProps, nextState) 接受的 props 发生变化或者自身 state 变化都会触发该生命周期，在此生命周期可以做一些渲染的优化，默认返回 true，就是默认需要更新组件，重新渲染，nextProps nextState 都是新 state 新 props，this.props this.state 表示旧的 props state，根据需求做优化，比如在某些情况下返回 false，便不再进行组件更新了，提升页面性能
例子
这个例子让你更好的理解几个生命周期的作用 Github 地址在这里
参考 react 官方文档 State & 生命周期 && 性能优化 章节
