Vue生命周期圖片
Vue生命周期
beforeCreate
created
beforeMount
mounted
beforeUpdate
updated
beforeDestroy
destroyed
beforeCreate
beforeCreate
實例組件剛創(chuàng)建，元素DOM和數(shù)據(jù)都還沒有初始化，暫時不知道能在這個周期里面進(jìn)行生命操作。
created
數(shù)據(jù)data已經(jīng)初始化完成橘原，方法也已經(jīng)可以調(diào)用役听，但是DOM為渲染。在這個周期里面如果進(jìn)行請求是可以改變數(shù)據(jù)并渲染愉粤，由于DOM未掛載，請求過多或者占用時間過長會導(dǎo)致頁面線上空白。
beforeMount
DOM未完成掛載铃辖，數(shù)據(jù)也初始化完成，但是數(shù)據(jù)的雙向綁定還是顯示{{}}猪叙，這是因為Vue采用了Virtual DOM（虛擬Dom）技術(shù)娇斩。先占住了一個坑。
mounted
數(shù)據(jù)和DOM都完成掛載穴翩，在上一個周期占位的數(shù)據(jù)把值給渲染進(jìn)去犬第。一般請求會放在這個地方，因為這邊請求改變數(shù)據(jù)之后剛好能渲染芒帕。
beforeUpdate
只要是頁面數(shù)據(jù)改變了都會觸發(fā)歉嗓，數(shù)據(jù)更新之前，頁面數(shù)據(jù)還是原來的數(shù)據(jù)背蟆，當(dāng)你請求賦值一個數(shù)據(jù)的時候會執(zhí)行這個周期鉴分，如果沒有數(shù)據(jù)改變不執(zhí)行。
updated
只要是頁面數(shù)據(jù)改變了都會觸發(fā)淆储，數(shù)據(jù)更新完畢冠场，頁面的數(shù)據(jù)是更新完成的。beforeUpdate和updated要謹(jǐn)慎使用本砰，因為頁面更新數(shù)據(jù)的時候都會觸發(fā)碴裙，在這里操作數(shù)據(jù)很影響性能和容易死循環(huán)。
beforeDestroy
這個周期是在組件銷毀之前執(zhí)行点额，在我項目開發(fā)中舔株，覺得這個其實有點類似路由鉤子beforeRouterLeave,都是在路由離開的時候執(zhí)行，只不過beforeDestroy無法阻止路由跳轉(zhuǎn)还棱，但是可以做一些路由離開的時候操作载慈，因為這個周期里面還可以使用data和method。比如一個倒計時組件珍手，如果在路由跳轉(zhuǎn)的時候沒有清除办铡，這個定時器還是在的辞做，這時候就可以在這個里面清除計時器。
destroyed
說實在的寡具，我還真的不知道這個周期跟beforeDestroy有什么區(qū)別秤茅，我在這個周期里面調(diào)用data的數(shù)據(jù)和methods的方法都能調(diào)用，所以我會覺得跟beforeDestroy是一樣的童叠。
