search

Vitaminaq / interview-collection

前端面试合集
3 stars 0 forks source link

react类组件钩子函数执行顺序 #9

Open Vitaminaq opened 2 years ago

Vitaminaq commented 2 years ago

react

初始化：父constructor -> 父componentWillMount【旧】-> 父render -> 子constructor -> 子componentWillMount -> 
子render -> 子componentDidMount -> 父componentDidMount

state变化：父shouldComponentUpdate -> 父componentWillUpdate【旧】 -> 父render -> 子componentWillReceiveProps ->
 子shouldComponentUpdate -> 子componentWillUpdate -> 子render -> 子componentDidUpdate -> 父componentDidUpdate

props变化：componentWillReceiveProps【旧】 -> shouldComponentUpdate -> componentWillUpdate【旧】 -> render -> 
componentDidUpdate

卸载：父componentWillUnmount -> 子componentWillUnmount

拓展vue

父beforeCreate -> 父created -> 父beforeMount -> 子beforeCreate -> 子created -> 子beforeMount ->子 mounted -> 父mounted

父beforeUpdate->子beforeUpdate->子updated->父updated

父beforeDestroy->子beforeDestroy->子destroyed->父destroyed