組件實(shí)例從創(chuàng)建到銷(xiāo)毀锹雏,中間會(huì)經(jīng)歷幾個(gè)階段磷籍,如上圖所示即横。
1. beforeCreate:?在實(shí)例初始化之后袄秩,數(shù)據(jù)觀測(cè)(data? observation)和事件/監(jiān)聽(tīng)器配置之前被調(diào)用阵翎。此時(shí)Vue實(shí)例的掛載元素$el和數(shù)據(jù)對(duì)象data都為undefined,還未初始化。
2.?created: 在實(shí)例創(chuàng)建完成后立即調(diào)用之剧。在這一階段郭卫,實(shí)例已經(jīng)完成對(duì)選項(xiàng)的處理,這意味著以下選項(xiàng)已經(jīng)被配置:數(shù)據(jù)觀測(cè)(data? observation)背稼、計(jì)算屬性贰军、方法、watch/event回調(diào)蟹肘。然而词疼,掛載階段還沒(méi)有開(kāi)始,$el屬性目前還不可用帘腹,一般可以在這個(gè)鉤子函數(shù)從后臺(tái)請(qǐng)求數(shù)據(jù)為mounted渲染做準(zhǔn)備贰盗。
3. beforeMount:?在掛載開(kāi)始之前調(diào)用,render函數(shù)將首次被調(diào)用竹椒。此時(shí)童太,還無(wú)法操作DOM米辐,比起created鉤子胸完,在這一階段只是多了$el屬性,但值還是undefined。
4. mounted:?在實(shí)例被掛載后調(diào)用翘贮,其中el被新創(chuàng)建的vm.$el替換赊窥,在這個(gè)鉤子里元素已經(jīng)渲染完成,可以操作DOM狸页,比如手動(dòng)監(jiān)聽(tīng)DOM事件锨能。可以在這個(gè)鉤子中向服務(wù)端發(fā)起請(qǐng)求芍耘,獲取數(shù)據(jù)址遇。不過(guò)要注意,向服務(wù)端請(qǐng)求數(shù)據(jù)是異步行為斋竞,如果你的模板渲染依賴(lài)該數(shù)據(jù)倔约,最好不要在這個(gè)鉤子中去獲取,因?yàn)榭赡軙?huì)出現(xiàn)數(shù)據(jù)還未獲取到坝初,模板已經(jīng)渲染了的情況浸剩。mounted并不保證所有的子組件已掛載钾军。如果想等到視圖渲染完畢,可以使用vm.$nextTick绢要。
5.?beforeUpdate:?在修補(bǔ)DOM之前吏恭,當(dāng)數(shù)據(jù)更改時(shí)調(diào)用≈刈铮可以在這個(gè)鉤子中進(jìn)一步修改Vue實(shí)例的數(shù)據(jù)屬性樱哼,而不會(huì)觸發(fā)額外的重新渲染過(guò)程。
6. updated:?在數(shù)據(jù)更改導(dǎo)致的虛擬DOM被重新渲染和修補(bǔ)后調(diào)用該鉤子剿配。當(dāng)這個(gè)鉤子調(diào)用時(shí)唇礁,組件的DOM已經(jīng)被更新,所以在這里可以執(zhí)行依賴(lài)于DOM的操作惨篱。然而在大多數(shù)情況下盏筐,應(yīng)該避免在這個(gè)中更改狀態(tài)(即修改Vue實(shí)例的數(shù)據(jù)屬性),這容易導(dǎo)致死循環(huán)砸讳。updated并不保證所有子組件已重新渲染琢融。如果想等到視圖渲染完畢,可以使用vm.$nextTick簿寂。
7. activated:?當(dāng)keep-alive組件激活時(shí)調(diào)用漾抬。
8. deactivated:?當(dāng)keep-alive組件停用時(shí)調(diào)用。
9. beforeDestroy:?在Vue實(shí)例被銷(xiāo)毀之前調(diào)用常遂。在這一階段纳令,實(shí)例仍然是完全可用的。
10. destroyed:?在Vue實(shí)例被銷(xiāo)毀后調(diào)用克胳。調(diào)用這個(gè)鉤子時(shí)平绩,Vue實(shí)例的所有指令已解除,所有的事件監(jiān)聽(tīng)器已移除漠另,所有的子實(shí)例已銷(xiāo)毀捏雌。
11. errorCaptured:?這個(gè)鉤子是2.5.0版本新增的。當(dāng)捕獲一個(gè)來(lái)自任何后代組件的錯(cuò)誤時(shí)被調(diào)用笆搓。此鉤子接收3個(gè)參數(shù):錯(cuò)誤對(duì)象性湿、發(fā)生錯(cuò)誤的組件實(shí)例,以及一個(gè)包含錯(cuò)誤來(lái)源信息的字符串满败。此鉤子返回false肤频,可以阻止錯(cuò)誤進(jìn)一步傳播。
所有的生命周期鉤子都自動(dòng)將它們的this上下文綁定到實(shí)例算墨,因此可以訪(fǎng)問(wèn)實(shí)例的數(shù)據(jù)宵荒、計(jì)算屬性和方法。