beforeCreate:
此時$data和$el都不存在
1.周遊data所有屬性,通過Object.defineProperty把這些屬性全部轉為getter/setter,并通過watcher(每個vue執行個體都會有一個)對屬性Observe記錄為依賴。
2. 初始化各種event。
created:
此時$data已經存在,$el還不存在
檢查是否有el選項,有的話檢查是否有template選項沒有的話等vm.$mout(el)後再去檢查是否有template選項 → 如果有template選項會去compile template并丢到render funtion裡,如果沒有template選項會去Compile el’s 的outerHTML做為template。
beforeMount:
此時$el已經存在了,但是UI上顯示的data屬性為virtual Dom的屬性
建立vm.$el并用它替換’el’選項。
mounted:
$data和$el已經挂載完成,監聽data change并rerender UI
beforeUpdate、updated:
Virtual Dom 重新渲染UI
beforeDestroy:
Teardown watchers,childcomponents and event listeners
destroyed:
Teardown done
參考文章:
https://cn.vuejs.org/v2/guide/reactivity.html
https://segmentfault.com/a/1190000008010666