组件生命周期,组件本质上是状态机
组件把状态和结果一一对应起来
组件中有state状态 和 props属性,属性是有父组件传递给子组件的,状态是子组件内部维护的数据,当状态发生变化时组件也会相对应的更新,我们可以理解成一个state对应一个render结果。
状态发生转换时会触发不同钩子函数,从而让开发者有机会做出响应,状态转换是有react内部维护的,我们不能参与其中,但是给我们开发者提供了钩子函数,我们可以自己编写钩子函数,这样react转换时就调用了这些钩子函数
组件初始化阶段:
getDefaultProps 获取实例默认属性(组件在第一个实例化时调用也就说从第2次实例只会调用getInitialState)
getInitialState 获取实例初始状态
componentWillMount 组件即将被装载渲染到页面时触发该函数(意思是组件还没有被渲染到页面)
render 组件在render生成虚拟DOM节点jsx,最后由react渲染成真正节点放在页面中
componentDidMount 组件装载之后调用,已经渲染完成到页面中
运行中阶段:
componentWillReceiveProps 组件将要接收到属性时调用(接收到属性之前触发),如果组件的属性发生变化,比如说父组件改变了子组件的属性,那么组件就需要更新
shouldComponentUpdate 当组件接收到新属性或者新状态时候就会触发这个函数,有时候我改变属性或者状态时候不需要更新组件render就可以在这一不return false告诉react 不需要render后面操作(从而可以提供性能)
componentWillUpdate 在render触发之前调用,它是在组件更新操作触发,而不是初始化阶段
render 和初始化阶段render是一样的
componentDidUpdate 它是在render结束之后真正DOM渲染完成后调用
销毁阶段触发的函数
componentWillUnmount 会在销毁操作执行之前调用,给开发者最后的机会来做一下清理操作