Vue所有的生命週期鉤子自動繫結在this上下文到例項中，因此你可以訪問資料，對屬性和方法進行運算。這意味著你不能使用箭頭函式來定義一個生命週期方法。這是因為箭頭函式綁定了父上下文，因此this與你期待的Vue例項不同。

1、beforeCreate

　　在例項初始化之後，資料觀測和event/watcher時間配置之前被呼叫。
　　
2、created

　　例項已經建立完成之後被呼叫。在這一步，例項已經完成以下的配置：資料觀測，屬性和方法的運算，watch/event事件回撥。然而，掛載階段還沒開始，$el屬性目前不可見。
　　
3、beforeMount

　　在掛載開始之前被呼叫：相關的render函式首次被呼叫。
　　該鉤子在伺服器端渲染期間不被呼叫。
　　
4、mounted

el被新建立的 vm.$el替換，並掛在到例項上去之後呼叫該鉤子函式。如果root例項掛載了一個文件內元素，當mounted被呼叫時vm.$el也在文件內。該鉤子在服務端渲染期間不被呼叫。
　　
5、beforeUpdate

　　資料更新時呼叫，發生在虛擬DOM重新渲染和打補丁之前。
　　你可以在這個鉤子中進一步第更改狀態，這不會觸發附加的重渲染過程。
　　該鉤子在服務端渲染期間不被呼叫。
　　
6、updated

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

　　keep-alive元件啟用時呼叫。
　　該鉤子在伺服器端渲染期間不被呼叫。
　　
8、deactivated

　　keep-alive元件停用時呼叫。
　　該鉤子在服務端渲染期間不被呼叫。
　　
9、beforeDestroy 【類似於React生命週期的componentWillUnmount】

　　例項銷燬之間呼叫。在這一步，例項仍然完全可用。
　　該鉤子在服務端渲染期間不被呼叫。
　　
10、destroyed

　　Vue例項銷燬後呼叫。呼叫後，Vue例項指示的所有東西都會解繫結，所有的事件監聽器會被移除，所有的子例項也會被銷燬。

含有keep-alive 生命週期鉤子：

在被keep-alive包含的元件/路由中，會多出兩個生命週期的鉤子: activated 與 deactivated。
在 2.2.0 及其更高版本中，activated 和 deactivated 將會在 樹內的所有巢狀元件中觸發。

activated在元件第一次渲染時會被呼叫，之後在每次快取元件被啟用時呼叫。

activated呼叫時機：

第一次進入快取路由/元件，在mounted後面，beforeRouteEnter守衛傳給 next 的回撥函式之前呼叫：

    beforeMount=> 如果你是從別的路由/元件進來(元件銷燬destroyed/或離開快取deactivated)=>
    mounted=> activated 進入快取元件 => 執行 beforeRouteEnter回撥

因為元件被快取了，再次進入快取路由/元件時，不會觸發這些鉤子：

   // beforeCreate created beforeMount mounted 都不會觸發。

• 1

所以之後的呼叫時機是：

 元件銷燬destroyed/或離開快取deactivated => activated 進入當前快取元件 
    => 執行 beforeRouteEnter回撥
    // 元件快取或銷燬，巢狀元件的銷燬和快取也在這裡觸發

• 1
• 2
• 3

deactivated：元件被停用(離開路由)時呼叫

使用了keep-alive就不會呼叫beforeDestroy(元件銷燬前鉤子)和destroyed(元件銷燬)，因為元件沒被銷燬，被快取起來了。
這個鉤子可以看作beforeDestroy的替代，如果你快取了元件，要在元件銷燬的的時候做一些事情，你可以放在這個鉤子裡。
如果你離開了路由，會依次觸發：

 元件內的離開當前路由鉤子beforeRouteLeave =>  路由前置守衛 beforeEach =>
 全域性後置鉤子afterEach => deactivated 離開快取元件 => activated 進入快取元件(如果你進入的也是快取路由)

 // 如果離開的元件沒有快取的話 beforeDestroy會替換deactivated 
 // 如果進入的路由也沒有快取的話  全域性後置鉤子afterEach=>銷燬 destroyed=> beforeCreate等

關於生命週期鉤子需要注意的內容：

• ajax請求最好放在created裡面，因為此時已經可以訪問this了，請求到資料就可以直接放在data裡面。
  這裡也碰到過幾次，面試官問：ajax請求應該放在哪個生命週期。

• 關於dom的操作要放在mounted裡面，在mounted前面訪問dom會是undefined。

• 每次進入/離開元件都要做一些事情，用什麼鉤子：

  （1）不快取：
  進入的時候可以用created和mounted鉤子，離開的時候用beforeDestory和destroyed鉤子,beforeDestory可以訪問this，destroyed不可以訪問this。

  （2）快取了元件：
  快取了元件之後，再次進入元件不會觸發beforeCreate、created 、beforeMount、 mounted，如果你想每次進入元件都做一些事情的話，你可以放在activated進入快取元件的鉤子中。
  同理：離開快取元件的時候，beforeDestroy和destroyed並不會觸發，可以使用deactivated離開快取元件的鉤子來代替。

觸發鉤子的完整順序：

將路由導航、keep-alive、和元件生命週期鉤子結合起來的，觸發順序，假設是從a元件離開，第一次進入b元件：

1- beforeRouteLeave:路由元件的元件離開路由前鉤子，可取消路由離開。

2- beforeEach: 路由全域性前置守衛，可用於登入驗證、全域性路由loading等。

3- beforeEnter: 路由獨享守衛

4- beforeRouteEnter: 路由元件的元件進入路由前鉤子。

5- beforeResolve:路由全域性解析守衛

6- afterEach:路由全域性後置鉤子

7- beforeCreate:元件生命週期，不能訪問this。

8- created:元件生命週期，可以訪問this，不能訪問dom。

9- beforeMount:元件生命週期

10- deactivated: 離開快取元件a，或者觸發a的beforeDestroy和destroyed元件銷燬鉤子。

11- mounted:訪問/操作dom。

12- activated:進入快取元件，進入a的巢狀子元件(如果有的話)。

13- 執行beforeRouteEnter回撥函式next。

 轉自https://blog.csdn.net/qq_24147051/article/details/81167093