Vue生命周期
-
创造阶段(created,beforeCreate)
- created
- 没有this.$el
- 也没有真是的dom
- 但是已经有数据,那么可以再这里去更改数据。如果数据是同步修改,就是带入到下一个生命周期。如果是异步修改,当数据改完之后就会进入更新阶段,推荐在这个阶段ajax请求。
- created
-
挂载阶段
-
beforeMount:
- 这里已经能看到this.$el,但是还没有进行真是的模板数据替换。
-
mounted:
- 在这里this.$el已经是真实的数据渲染的dom。在这里才能取到真实的dom,如果想要取到真实的dom,一般在这之后。一些第三方的dom操作也会在这里来进行初始化,仅限没有异步数据的dom,有些人也喜欢在这里做ajax请求。
-
更新
- beforeUpdate
- 这里基本上不做太多事情
- updated
- 有可能需要在这里来重新初始化第三方的dom操作插件
- beforeUpdate
-
销毁
- beforeDestroy
- 在这里一般会去解除一些事件的监听
- destroyed
- beforeDestroy
this.$nextTick
//方法1
this.$nextTick().then(()=>{
this.init()
})
//方法2
this.$nextTick(()=>{
this.init()
})
该方法用于ajax请求,处理异步。
在created时,dom还是没有应用新数据的dom
而this.$nextTick里的dom就是已经使用了更新的数据的dom。
该方法与updated效果差不多。