在vue組件中，生命周期指的是從組件創建開始，到組件銷毀，所經歷的整個過程；在這個過程中的一些不同的階段，vue會調用指定的一些組件方法?；旧芷诤瘮涤邢旅鎺讉€階段：創建階段、掛載階段、更新階段、卸載階段、其它。

于田網站制作公司哪家好，找創新互聯！從網頁設計、網站建設、微信開發、APP開發、成都響應式網站建設公司等網站項目制作，到程序開發，運營維護。創新互聯于2013年成立到現在10年的時間，我們擁有了豐富的建站經驗和運維經驗，來保證我們的工作的順利進行。專注于網站建設就選創新互聯。

本教程操作環境：windows7系統、vue2.9.6版，DELL G3電腦。

1、組件生命周期

組件生命周期指的是組件從創建到銷毀的過程，在這個過程中的一些不同的階段，vue會調用指定的一些組件方法。

基本生命周期函數有下面幾個階段：

創建階段掛載階段更新階段卸載階段其它

每一個階段都對應著之前和之后兩個函數。

2、創建階段

2-1、beforeCreate()

在實例初始化之后，數據觀測 (data observer) 和 event/watcher 事件配置之前被調用。初始化階段，應用不多。

2-2、created()

在實例創建完成后被立即調用。在這一步，實例已完成以下的配置：數據觀測 (data observer)，property 和方法的運算，watch/event 事件回調。然而，掛載階段還沒開始，$elproperty 目前尚不可用。

3、掛載階段

3-1、beforeMount()

在掛載開始之前被調用：相關的render函數首次被調用。

3-2、mounted()

該階段執行完了模板解析，以及掛載。同時組件根組件元素被賦給了$el屬性，該階段可以通過 DOM 操作來對組件內部元素進行處理了。

4、更新階段

4-1、beforeUpdate()

數據更新時調用，但是還沒有對視圖進行重新渲染，這個時候，可以獲取視圖更新之前的狀態。

4-2、updated()

由于數據的變更導致的視圖重新渲染，可以通過 DOM 操作來獲取視圖的最新狀態。

5、卸載階段

5-1、beforeDestroy()

實例銷毀之前調用，移除一些不必要的冗余數據，比如定時器。

5-2、destroyed()

Vue 實例銷毀后調用。

6、其它

6-1、.$nextTick()

將回調延遲到下次 DOM 更新循環之后執行。在修改數據之后立即使用它，然后等待 DOM 更新。它跟全局方法Vue.nextTick一樣，不同的是回調的this自動綁定到調用它的實例上。

與updated有些類似，this.$nextTick()可以用作局部的數據更新后DOM更新結束后的操作，全局的可以用updated生命周期函數。

6-2、errorCaptured()

當捕獲一個來自子孫組件的錯誤時被調用，此鉤子會收到三個參數：錯誤對象、發生錯誤的組件實例以及一個包含錯誤來源信息的字符串。此鉤子可以返回false以阻止該錯誤繼續向上傳播。

7、生命周期的一些使用場景

**created：**進行ajax請求異步數據的獲取、初始化數據

**mounted：**掛載元素dom節點的獲取

**$nextTick：**針對單一事件更新數據后立即操作dom

**updated：**任何數據的更新

【相關推薦：《vue.js教程》】

本文名稱：vue組件的生命周期是什么
URL地址：http://vcdvsql.cn/article48/choehp.html

成都網站建設公司_創新互聯，為您提供網站導航、品牌網站制作、軟件開發、關鍵詞優化、網站制作、移動網站建設

廣告

聲明：本網站發布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網站立場，如需處理請聯系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經允許不得轉載，或轉載時需注明來源： 創新互聯