react生命周期主要有三个阶段: 实例化,存在期,销毁&清理期
实例化
1.getDefaultProps()
最新版本的react已经移除了该方法
2.getInitialState()
这个方法中可以访问到this.props
3.componentWillMount()
完成首次渲染之前被调用,这也是在render方法调用前可以修改组件state的最后一次机会
4.render()
这个方法是唯一一个必需的方法;
该方法会创建虚拟DOM,表示组件的输出;返回的结果不是真正的DOM,而是一个虚拟的表现,react会把这个虚拟DOM和内存中的DOM作比较从而决定是否有必要做出修改.
注意: 1.只能通过this.props和this.state访问数据
2.可以返回null, false或者任何react组件
3.只能出现一个顶级组件(不能返回一组元素)
4.必须纯净, 不能改变组件的状态或者修改DOM的输出
5.componentDidMount()
render方法成功调用并且真实的DOM已经被渲染之后,可以在这个方法中访问到真实的DOM.其他一些方法也可以挂载在该生命周期钩子函数中.
当react运行在服务端时,这个方法不会被调用
以上生命周期都属于实例化阶段.实例化好了以后,用户通过各种交互方式可能会使得props和state发生变化,这些都属于存在期的生命周期钩子函数.
存在期
componentWillReceiveProps(nextProps)
可以更改state和props
shouldComponentUpdate(nextProps, nextState)
该方法返回false会告诉react跳过render()方法,以及位于render前后的钩子函数: componentWillUpdate()和componentDidUpdate();
通常情况下不使用该方法;首次渲染也不会调用这个方法(没有在实例化阶段出现);
componentWillUpdate(nextProps, nextState)
组件会在接收到新的props或者状态进行渲染之前调用该方法;
不可以在该方法中更新state或者props,而是在componentWillReceiveProps中更新状态
componentDidUpdate(prevProps, prevState)
该方法给了我们更新已经渲染好的DOM的机会
销毁&清理期
componentWillUnmount()
组件移除之前被调用,让我们有机会做一些清理工作
此外,新版本的react还增加了其他的生命周期钩子函数,但以上的生命周期是使用频率最高的,最重要的
