關于Vue的生命周期網上有太多這方面的文章，我引文一篇寫的還可以的文章內容進行介紹。[內容來自](https://segmentfault.com/a/1190000014376915) ## 網上一張詳細介紹生命周期的示圖：  ## 每個周期的詳細介紹(個人感覺通俗易懂) 在談到Vue的生命周期的時候，我們首先需要創建一個實例，也就是在 new Vue ( ) 的對象過程當中，首先執行了init（init是vue組件里面默認去執行的），在init的過程當中首先調用了beforeCreate，然后在injections（注射）和reactivity（反應性）的時候，它會再去調用created。所以在init的時候，事件已經調用了，我們在beforeCreate的時候千萬不要去修改data里面賦值的數據，最早也要放在created里面去做（添加一些行為）。 當created完成之后，它會去判斷instance（實例）里面是否含有“el”option（選項），如果沒有的話，它會調用vm.$mount(el)這個方法，然后執行下一步；如果有的話，直接執行下一步。緊接著會判斷是否含有“template”這個選項，如果有的話，它會把template解析成一個render function ，這是一個template編譯的過程，結果是解析成了render函數： ~~~ render (h) { return h('div', {}, this.text) } ~~~ 解釋一下，render函數里面的傳參h就是Vue里面的createElement方法，return返回一個createElement方法，其中要傳3個參數，第一個參數就是創建的div標簽；第二個參數傳了一個對象，對象里面可以是我們組件上面的props，或者是事件之類的東西；第三個參數就是div標簽里面的內容，這里我們指向了data里面的text。 使用render函數的結果和我們之前使用template解析出來的結果是一樣的。render函數是發生在beforeMount和mounted之間的，這也從側面說明了，在beforeMount的時候，$el還只是我們在HTML里面寫的節點，然后到mounted的時候，它就把渲染出來的內容掛載到了DOM節點上。這中間的過程其實是執行了render function的內容。 在使用.vue文件開發的過程當中，我們在里面寫了template模板，在經過了vue-loader的處理之后，就變成了render function，最終放到了vue-loader解析過的文件里面。這樣做有什么好處呢？原因是由于在解析template變成render function的過程，是一個非常耗時的過程，vue-loader幫我們處理了這些內容之后，當我們在頁面上執行vue代碼的時候，效率會變得更高。 beforeMount在有了render function的時候才會執行，當執行完render function之后，就會調用mounted這個鉤子，在mounted掛載完畢之后，這個實例就算是走完流程了。 后續的鉤子函數執行的過程都是需要外部的觸發才會執行。比如說有數據的變化，會調用beforeUpdate，然后經過Virtual DOM，最后updated更新完畢。當組件被銷毀的時候，它會調用beforeDestory，以及destoryed。 這就是vue實例從新建到銷毀的一個完整流程，以及在這個過程中它會觸發哪些生命周期的鉤子函數。那說到這兒，可能很多童鞋會問，鉤子函數是什么意思？ 鉤子函數，其實和回調是一個概念，當系統執行到某處時，檢查是否有hook，有則回調。說的更直白一點，每個組件都有屬性，方法和事件。所有的生命周期都歸于事件，在某個時刻自動執行。