簡單講一下vue生命周期 與

2023-4-11    前端達人

Vue組件實例在創(chuàng)建、更新和銷毀過程中，會依次觸發(fā)一些鉤子函數(shù)，這些鉤子函數(shù)稱為Vue生命周期函數(shù)。Vue的生命周期分為四個階段：創(chuàng)建階段、掛載階段、更新階段和銷毀階段。

  1. 創(chuàng)建階段：

在創(chuàng)建階段，Vue實例正在被創(chuàng)建，這個階段中包含了實例化、數(shù)據(jù)觀測、事件/鉤子初始化等過程。具體包括以下鉤子函數(shù)：

  • beforeCreate: 在實例剛被創(chuàng)建之后，數(shù)據(jù)觀測 (data observer) 和 event/watcher 事件配置之前被調(diào)用。
  • created: 實例已經(jīng)完成數(shù)據(jù)觀測 (data observer)，屬性和方法的運算，watch/event 事件回調(diào)，但還沒有開始 DOM 操作?？梢栽L問到computed等屬性。
  1. 掛載階段：

在這個階段，Vue實例將模板渲染成真實的DOM并進行掛載到頁面上。具體包括以下鉤子函數(shù)：

  • beforeMount: 在模板編譯/掛載之前被調(diào)用。
  • mounted: el被新創(chuàng)建的 vm.$el 替換，并掛載到實例上去之后調(diào)用該鉤子函數(shù)，此時組件已經(jīng)出現(xiàn)在頁面中。
  1. 更新階段：

在這個階段，當(dāng)Vue實例的數(shù)據(jù)變化時，它會重新渲染虛擬DOM并更新到頁面上。具體包括以下鉤子函數(shù)：

  • beforeUpdate: 數(shù)據(jù)更新時調(diào)用，發(fā)生在虛擬DOM重新





藍藍設(shè)計建立了UI設(shè)計分享群，每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計，如果有興趣的話，可以進入一起成長學(xué)習(xí)，請加微信ban_lanlan，報下信息，藍小助會請您入群。歡迎您加入噢~~

希望得到建議咨詢、商務(wù)合作，也請與我們聯(lián)系01063334945。 



分享此文一切功德，皆悉回向給文章原作者及眾讀者. 免責(zé)聲明：藍藍設(shè)計尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時與我們?nèi)〉寐?lián)系，我們立即更正或刪除。 



藍藍設(shè)計( www.bouu.cn )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)、UI設(shè)計公司、界面設(shè)計公司、UI設(shè)計服務(wù)公司、數(shù)據(jù)可視化設(shè)計公司、UI交互設(shè)計公司、高端網(wǎng)站設(shè)計公司、UI咨詢、用戶體驗公司、軟件界面設(shè)計公司。

分享本文至：

日歷

鏈接

個人資料

藍藍設(shè)計的小編 http://www.bouu.cn

存檔