Vue的生命周期

90 阅读1分钟

vue的生命周期分为4个阶段:初始化(前/后)载入(前/后),更新(前/后),销毁(前/后)

1:beforeCreate

在new一个vue的实例后,此时只有一些默认的钩子函数和事件,其它的东西还没有被创建,data和methods还没有被初始化,还无法访问。

2:create

此时,data和methods的数据已经被初始化了,可以访问data和methods的数据了,可以做一些请求的操作

3:beforeMount

执行到这个钩子的时候,模板已经编译好了,但是还没有挂载到页面上,所以页面上的数据还是旧的

4:mounted

执行到这里时,组件已经创建完成了,已经脱离了创建阶段,开始进入到运行阶段了,此时dom也是最新的了,可以在这个阶段操作dom了

5:beforeUpdate

当执行到这个钩子时,data已经是最新的了,但是页面上的数据还是旧的

6:update

当执行到这个钩子时,data和dom都已经是最新的了

7:beforeDestory

页面开始销毁,但是过滤器,指令等还是可用状态的,还没有真正的被销毁

8:destoryed

此时页面已经被销毁,过滤器,指令,等都是不可用状态。页面销毁以后,更新data是不会再触发dom更新的,但是dom结构依然还在