最近看了下React,熟悉一个框架的开始总是需要了解他的生命周期
所以小小记录一下并分享
Mounting 组件挂载
//在组件即将被挂载到页面的时刻执行,还没有被挂载到页面
compontWillMount(){}
//render页面挂载
render(){}
//在页面被挂载之后会被执行
compontDidMount(){}
需要注意的是compontWillMount 和 compontDidMount这两个函数 ,仅仅是在页面第一次被挂载的时候执行
Updation 组件发生变化的时候
states发生变化的时候
//当组件被更新之前他会被执行要求返回结果
//要求返回结果的原因在于是否需要更新组建
//返回false页面就不会被触发了
//接受两个参数一个是改变后的Props和改变后的State
shouldComponentUpdate(nextProps,nextState){}
//组件被更新之前被执行
componentWillUpdate(){}
//当组件被更新之后执行的函数
componentDidUpdate(){}
的说法props变化的时候
//当子组件从父组件中接受了参数
//然后父组件的render函数被执行以后,子组件的此生命周期函数将被执行
//如果这个组件第一次存在于父组件中,不会被执行
//如果这个组件已经存在于父组件中,才会被执行
componentWillReceiveProps(){}
1、componentWillUpdate 和 shouldComponentUpdate 都属于当组件被更新之前执行的生命周期函数,那么区别在于前者需要在后者返回了true以后才会被执行,同事也是在其之后执行。
2、componentWillReceiveProps这个生命周期函数,触发的条件是组件一定要接受了父组件的参数,且并不是第一次被执行的时候,才会触发。
3、父组件的render函数被执行的时候,子组件的render函数也会被执行
这个时候shouldComponentUpdate这个函数可以通过适时返回false使子组件不去更新,已达到节省性能的目的。
Updation 组件发生变化的时候
Unmounting组件卸载的时候
//当这个组件即将被从页面中删除的时候
componentWillUnmounting(){}