Vue生命周期详解

生命周期

1. 含义：组件从创建到销毁的整个过程，这个过程就是声明周期
2. 如何知道组件到了什么阶段？（钩子函数）

钩子函数

1. Vue框架内置函数，随着组件的声明周期阶段，自动执行

2. 作用：在特定的时间点，执行特定的操作

3. 分类4大阶段8个方法

阶段	方法名	方法名
初始化	beforeCreate	created
挂载	beforeMount	mounted
更新	beforeUpdate(DOM的更新前)	updated(DOM的更新后)
销毁	beforeDestroy	destroyed

初始化阶段：

• beforeCreate
• created
  1. 可以获取到 data / methods 中的数据
  2. 不能获取真实 DOM
  3. 一般在此处发送 ajax 请求

挂载阶段

• beforeMount
• mounted
  1. 可以获取真实 DOM
  2. 当组件执行到此钩子后, 就进入一个稳定状态了, 此时页面也加载完成

更新阶段

• beforeUpdate
  1. 不能获取更新后的真实 DOM, 但是可以获取更新后的数据
• updated
  1. 可以获取更新后的真实 DOM

销毁阶段

• beforeDestroy
  1. 应用场景: 清除全局事件或定时器
• destroyed