1. 程式人生 > >Vue父子元件鉤子函式

Vue父子元件鉤子函式

vue父子元件鉤子函式觸發順序

beforeMount後mounted前構造子元件 依次遍歷

beforeCreate-父元件
create-父元件
beforeMount-父元件
beforeCreate-子元件
create-子元件
beforeMount-子元件
beforeCreate-次子元件
create-次子元件
beforeMount-次子元件
mounted-次子元件
mounted-子元件

mounted-父元件

鉤子函式發生的事

beforeCreate-元件剛例項化完成 el 和 data 都為undefined 
created-元件例項化完成 data 資料有值,Dom還未生成 el沒有值

beforeMount-虛擬Dom已生成 el 和 data 有值 此時顯示<span>{{message}}</span>  俗稱佔坑

mounted-掛載完成 此時顯示 <span>123 </span>