1,了解生命周期
為方便了解,實例初始值如圖:

實例如圖
create:創(chuàng)建

create代碼

瀏覽器控制臺打印
如果可以看到創(chuàng)建 created 的方法里,實例對象data 值都加載完成,但是Dom節(jié)點并未加載完,所以如果初始獲取接口賦值給data的情況下,建議在這個函數(shù)里處理。
mount:掛載

mounte代碼

瀏覽器控制臺打印
如果是Dom元素進行調(diào)用,建議放到 mounted 函數(shù)的 $nextTick 里
update:更新

update代碼

初始瀏覽器控制臺打印

value變量修改之后會觸發(fā)
value變量更新渲染頁面之后觸發(fā)
destroy:銷毀

destroy代碼

瀏覽器控制臺打印
關(guān)閉頁面,離開當前路由情況下執(zhí)行,如果頁面有定時器,建議在次進行銷毀定時器,否則離開路由情況并未關(guān)閉頁面的情況下,定時器依舊執(zhí)行,浪費進程。
2,父組件生命周期順序如下:
父組件生命周期代碼如下:

父組件代碼
table-data 子組件生命周期如下:

子組件代碼
瀏覽器打印順序如下:

瀏覽器控制臺打印順序
有次可見,生命周期順序為:
父組件 created --> 子組件 created --> 子組件 mounted --> 父組件 mounted
會發(fā)現(xiàn)調(diào)用順序不是父組件都調(diào)用完成之后再調(diào)用子組件,父組件向子組件傳值時,如果值返回是異步情況下,有時會導致子組件并未接收到值立馬渲染到頁面上,此時建議用 watch、computed?來監(jiān)聽值變化。