生命周期：

  • 通俗点说，生命周期就是从”无-->有-->无“，这一过程
  • 在Vue中，Vue的生命周期指的是：从创建Vue对象到销毁Vue对象的过程
  • 生命周期函数也称为钩子函数

图解：

Vue生命周期.png

钩子函数——beforeCreate()：

  • 无法通过vm访问到data中的数据、methods中的方法

钩子函数——created()：

  • 可以通过vm访问到data中的数据、methods中配置的方法

钩子函数——beforeMount()：

  • 页面呈现的是未经Vue编译的DOM结构
  • 对所有DOM的操作，最终都不奏效

钩子函数——mounted()：

  • 页面中呈现的是经过Vue编译的DOM
  • 对DOM的操作均有效（尽可能避免）至此初始化过程结束
  • 一般在此进行：开启定时器、发送网络请求、订阅消息、绑定自定义事件、等初始化操作

钩子函数——beforeUpdate()：

  • 数据是新的，但页面是旧的，即：页面尚未和数据保持同步

钩子函数——updated()：

  • 数据是新的，页面也是新的，即：页面和数据保持同步

钩子函数——beforeDestroy()：

  • vm中所有的：data、methods、指令等等，都处于可用状态，马上就要执行销毁过程，一般在此阶段：关闭定时器、取消订阅消息、解绑自定义事件等收尾工作

钩子函数——destroyed()：

  • Vue实例销毁后调用，Vue实例指示的所有东西都会被解绑，所有的事件监听器也会被移除
最后修改：2024 年 07 月 26 日
© 允许规范转载
如果觉得我的文章对你有用，请随意赞赏