Vue生命周期

• 創造階段（created，beforeCreate）

  • created
    • 沒有this.$el
    • 也沒有真是的dom
    • 但是已經有資料，那麼可以再這裡去更改資料。如果資料是同步修改，就是帶入到下一個生命周期。如果是異步修改，當資料改完之後就會進入更新階段，推薦在這個階段ajax請求。

• 挂載階段

• beforeMount：
  • 這裡已經能看到this.$el,但是還沒有進行真是的模闆資料替換。
• mounted：
  • 在這裡this.$el已經是真實的資料渲染的dom。在這裡才能取到真實的dom，如果想要取到真實的dom，一般在這之後。一些第三方的dom操作也會在這裡來進行初始化，僅限沒有異步資料的dom，有些人也喜歡在這裡做ajax請求。

• 更新

  • beforeUpdate
    • 這裡基本上不做太多事情
  • updated
    • 有可能需要在這裡來重新初始化第三方的dom操作插件

• 銷毀

  • beforeDestroy
    • 在這裡一般會去解除一些事件的監聽
  • destroyed

this.$nextTick

//方法1
this.$nextTick().then(()=>{
   this.init()
})
//方法2
this.$nextTick(()=>{
    this.init()
})
           

該方法用于ajax請求，處理異步。

在created時，dom還是沒有應用新資料的dom

而this.$nextTick裡的dom就是已經使用了更新的資料的dom。

該方法與updated效果差不多。