關於vue生命週期以及其中的鉤子函式

2021-10-04 08:59:18 字數 1851 閱讀 4627

beforecreate(建立前) 在資料觀測和初始化事件還未開始

created(建立後) 完成資料觀測,屬性和方法的運算,初始化事件,el屬

性還沒有

顯示出來

befo

remo

unt(

載入前)

在掛載開

始之前被

呼叫,相

關的re

nder

函式首次

被呼叫。

例項已完

成以下的

配置:編

譯模板,

把dat

a裡面的

資料和模

板生成h

tml。

注意此時

還沒有掛

載htm

l到頁面

上。mo

unte

d(載入

後)在e

l被新創

建的vm

.el屬性還沒有顯示出來 beforemount(載入前) 在掛載開始之前被呼叫,相關的render函式首次被呼叫。例項已完成以下的配置:編譯模板,把data裡面的資料和模板生成html。注意此時還沒有掛載html到頁面上。 mounted(載入後) 在el 被新建立的 vm.

el屬性還沒

有顯示出

來bef

orem

ount

(載入前

)在掛載

開始之前

被呼叫,

相關的r

ende

r函式首

次被呼叫

。例項已

完成以下

的配置:

編譯模板

,把da

ta裡面

的資料和

模板生成

html

。注意此

時還沒有

掛載ht

ml到頁

面上。m

ount

ed(載

入後)在

el被新

建立的v

m.el 替換,並掛載到例項上去之後呼叫。例項已完成以下的配置:用上面編譯好的html內容替換el屬性指向的dom物件。完成模板中的html渲染到html頁面中。此過程中進行ajax互動。

beforeupdate(更新前) 在資料更新之前呼叫,發生在虛擬dom重新渲染和打補丁之前。可以在該鉤子中進一步地更改狀態,不會觸發附加的重渲染過程。

updated(更新後) 在由於資料更改導致的虛擬dom重新渲染和打補丁之後呼叫。呼叫時,元件dom已經更新,所以可以執行依賴於dom的操作。然而在大多數情況下,應該避免在此期間更改狀態,因為這可能會導致更新無限迴圈。該鉤子在伺服器端渲染期間不被呼叫。

beforedestroy(銷毀前) 在例項銷毀之前呼叫。例項仍然完全可用。

destroyed(銷毀後) 在例項銷毀之後呼叫。呼叫後,所有的事件***會被移除,所有的子例項也會被銷毀。該鉤子在伺服器端渲染期間不被呼叫。

什麼是vue生命週期?

答: vue 例項從建立到銷毀的過程,就是生命週期。從開始建立、初始化資料、編譯模板、掛載dom→渲染、更新→渲染、銷毀等一系列過程,稱之為 vue 的生命週期。

vue生命週期的作用是什麼?

答:它的生命週期中有多個事件鉤子,讓我們在控制整個vue例項的過程時更容易形成好的邏輯。

vue生命週期總共有幾個階段?

答:它可以總共分為8個階段:建立前/後, 載入前/後,更新前/後,銷毀前/銷毀後。

第一次頁面載入會觸發哪幾個鉤子?

答:會觸發 下面這幾個beforecreate, created, beforemount, mounted 。

dom 渲染在 哪個週期中就已經完成?

答:dom 渲染在 mounted 中就已經完成了。

vue 關於生命週期

序言 1.vue 單元件的生命週期 2.vue 父子元件的生命週期 3.axios 非同步請求 與 vue 的元件週期 vue的生命週期 淺白 簡單總結 1.beforecreate 此時 el data 的值都為 undefined 2.created 此時可以拿到 data 中的值,但是 thi...

關於vue的生命週期

關於vue的生命週期我們來看下這個官方的圖 從圖中我們很容易看的出vue元件的生命週期的鉤子函式有以下這些 下面分別說以下這些生命週期 beforecreate 這個生命週期如上圖所示 例項初始化在這個生命週期遍歷 data 物件下所有屬性將其轉化為 getter setter,也就是說新增乙個被觀...

uniapp的生命週期及其和vue生命週期的對比

頁面載入過程 載入 顯示 載入完成 頁面隱藏 頁面解除安裝 onload 監聽頁面載入 onshow 監聽頁面顯示 onready 監聽頁面初次渲染完成 onhide 監聽頁面隱藏 onunload 監聽頁面解除安裝 vue頁面載入過程 created 例項被建立後執行 beforemount 例項...