Vue 的父元件和子元件生命週期鉤子執行順序

2022-04-08 16:41:40 字數 606 閱讀 2943

vue 的父元件和子元件生命週期鉤子執行順序

渲染過程:父元件掛載完成一定是等子元件都掛載完成後,才算是父元件掛載完,所以父元件的mounted在子元件mouted之後。父beforecreate -> 父created -> 父beforemount -> 子beforecreate -> 子created -> 子beforemount -> 子mounted -> 父mounted

子元件更新過程:

影響到父元件: 父beforeupdate -> 子beforeupdate->子updated -> 父updated

不影響父元件: 子beforeupdate -> 子updated

父元件更新過程:

影響到子元件: 父beforeupdate -> 子beforeupdate->子updated -> 父updated

不影響子元件: 父beforeupdate -> 父updated

銷毀過程:父beforedestroy -> 子beforedestroy -> 子destroyed -> 父destroyed

看起來很多好像很難記憶,其實只要理解了,不管是哪種情況,都一定是父元件等待子元件完成後,才會執行自己對應完成的鉤子,就可以很容易記住

vue父元件和子元件生命週期的順序

1.渲染過程順序 父元件beforecreate 父元件created 父元件beforemount 子元件beforecreate 子元件created 子元件beforemount 子元件mounted 父元件mounted 2.更新過程順序 父元件更新過程 父元件beforeupdate 父元...

父元件和子元件生命週期的順序

當點選 change it 的時候,引起檢視變化,觸發beforeupdate和update 當點選 destroy parent1 引發父親元件的beforedestroy和destoryed 當點選 destory children1 引發子元件的beforedestroy和destoryed ...

VUE父元件監聽子元件的生命週期

比如有父元件 parent 和子元件 child,如果父元件監聽到子元件掛載 mounted 就做一些邏輯處理,可以通過以下寫法實現 parent.vue dosomething child.vue mounted 這屬於手動通過 emit觸發父元件的事件,實現監聽生命週期的作用。簡單的方式可以在父...