千鋒教育前端Vue3.0全套視頻教程(Kerwin2023版,Vue.js零基礎(chǔ)

- Vue組件生命周期鉤子函數(shù)是在組件不同階段執(zhí)行的特定函數(shù)。這些鉤子函數(shù)提供了在組件生命周期中執(zhí)行自定義邏輯的機(jī)會(huì)。生命周期鉤子函數(shù)主要有四個(gè)階段,八個(gè)函數(shù):beforeCreate:作用:在實(shí)例被創(chuàng)建之前調(diào)用,此時(shí)組件的選項(xiàng)和數(shù)據(jù)尚未初始化。
created:作用:在實(shí)例創(chuàng)建完成后調(diào)用,此時(shí)組件的選項(xiàng)和數(shù)據(jù)已經(jīng)初始化。
beforeMount:作用:在組件掛載之前調(diào)用,此時(shí)模板編譯已完成,但尚未將組件渲染到頁(yè)面中。
mounted:作用:在組件掛載到頁(yè)面后調(diào)用,此時(shí)組件已經(jīng)被渲染到頁(yè)面中。
beforeUpdate:作用:在組件更新之前調(diào)用,此時(shí)數(shù)據(jù)已更新但尚未重新渲染組件。
updated:作用:在組件更新完成后調(diào)用,此時(shí)組件已重新渲染到頁(yè)面中。
beforeDestroy:作用:在組件銷毀之前調(diào)用。
destroyed:作用:在組件銷毀完成后調(diào)用。
2.Vue 的父子組件生命周期鉤子函數(shù)執(zhí)行順序:
Vue 的父子組件鉤子函數(shù)的執(zhí)行順序可以歸類為4個(gè) 部分:
第一部分:首次加載渲染
父 beforeCreate -> 父 created -> 父 beforeMount -> 子 beforeCreate -> 子 created -> 子 beforeMount -> 子 mounted -> 父 mounted。
第二部分:父組件修改子組件的props值時(shí):
父 beforeUpdate -> 子 beforeUpdate -> 子 updated -> 父 updated
第三部分:父組件修改的數(shù)據(jù)跟子組件沒(méi)有關(guān)系時(shí),
不會(huì)影響子組件 父 beforeUpdate -> 父 updated
第四部分:銷毀過(guò)程
父 beforeDestroy -> 子 beforeDestroy -> 子 destroyed -> 父 destroyed