Vue實例的生命周期

Vue生命周期示意圖
  • 什么是生命周期:從Vue實例創建、運行、銷毀期間,總是伴隨著各種各樣的事件,這些事件統稱為生命周期。
  • 生命周期鉤子:就是生命周期事件的別名。
  • 主要的生命周期函數分類:
    • 創建期間的生命周期函數:
      • beforeCreate: Vue實例在內存中被創建出來,此時還沒有初始化好 data 和 methods 屬性
      • created: Vue實例已經在內存中創建, data 和 methods 屬性被創建完成,此時還沒有開始編譯模板
      • beforeMount: 此時已經完成了對模板的編譯,但是模板還沒有被掛載到頁面當中
      • mounted: 此時已經將編譯好的模板掛載到了頁面指定的容器中顯示
    • 運行期間的生命周期函數
      • beforeUpdate: 狀態更新之前執行此函數,此時data中的狀態值是最新的,但是界面上顯示的數據還是舊的,因為此時還沒有重新渲染DOM節點
      • updated: 實例更新完畢之后調用此函數,此時data中的狀態值與界面上顯示的數據同步,都已經完成了更新,界面被重新渲染好了
    • 銷毀期間的生命周期函數
      • beforeDestroy: 實例銷毀前調用,在這一步中,實例仍然可以使用
      • destroyed: Vue實例銷毀后調用,調用后Vue實例指示的所有東西都會解除綁定,所有的監聽器都會被移除,所有的子實例也會被銷毀
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明：文章內容（如有圖片或視頻亦包括在內）由作者上傳并發布，文章內容僅代表作者本人觀點，簡書系信息發布平臺，僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • Vue 實例有一個完整的生命周期，也就是從開始創建、初始化數據、編譯模板、掛載Dom→渲染、更新→渲染、卸載等一系...
    天字一等閱讀 458評論 0贊 0
  • 什么是生命周期 從Vue實例創建，運行，到銷毀期間，總是伴隨著各種各樣的事件，這些事件統稱為生命周期 生命周期鉤子...
    瑞破破閱讀 187評論 0贊 0
  • 每個 Vue 實例在被創建時都要經過一系列的初始化過程——例如，需要設置數據監聽、編譯模板、將實例掛載到 DOM ...
    hgzzz閱讀 872評論 0贊 0
  • 學習完整課程請移步 互聯網 Java 全棧工程師 什么是生命周期 Vue 實例有一個完整的生命周期，也就是從開始創...
    擼帝閱讀 424評論 0贊 4
  • 雖然經常使用mounted、created等幾個鉤子函數，但是并沒有很系統的將它和生命周期關聯一起去理解，這導致我...
    四小七閱讀 8,928評論 0贊 20