插件窝 干货文章 vue2生命周期有几个

vue2生命周期有几个

触发 strong 挂载 dom 575    来源:    2024-10-21
vue.js 2 的生命周期包含 8 个阶段:beforecreate:vue 实例创建后触发,dom 挂载前。created:dom 挂载前触发,虚拟 dom 已创建。beforemount:dom 挂载后,真实 dom 未插入前触发。mounted:dom 挂载后,真实 dom 已插入文档中触发。beforeupdate:数据更改后,虚拟 dom 更新前触发。updated:真实 dom 更新后触发。beforedestroy:实例销毁前引发,dom 已分离。destroyed:实例被完全销

Vue.js 2 的生命周期阶段

Vue.js 2 的生命周期包含以下 8 个阶段:

1. beforeCreate

  • 生命周期开始时触发。
  • 此时,Vue 实例已被创建,但未挂载到 DOM。

2. created

立即学习“前端免费学习笔记(深入)”;

  • 在 Vue 实例挂载到 DOM 之前触发。
  • 此时,虚拟 DOM 已经创建,但真实 DOM 尚未创建。

3. beforeMount

  • 在 Vue 实例挂载到 DOM 后触发。
  • 此时,虚拟 DOM 已被编译为真实 DOM,但尚未插入到真实 DOM 中。

4. mounted

  • 在 Vue 实例挂载到 DOM 后触发。
  • 此时,真实 DOM 已被插入到文档中。

5. beforeUpdate

  • 当 Vue 实例响应数据更改时触发。
  • 此时,虚拟 DOM 已被更新,但真实 DOM 尚未更新。

6. updated

  • 当 Vue 实例的 DOM 响应数据更改而更新后触发。

7. beforeDestroy

  • 在 Vue 实例销毁之前触发。
  • 此时,Vue 实例已与 DOM 分离。

8. destroyed

  • 在 Vue 实例被完全销毁后触发。