Vue2 生命周期中最初获取 data,真实 DOM 覆盖完毕,模板与数据不一致,销毁之前四个阶段的生命周期函数分别是?
时间: 2024-02-01 21:12:39 浏览: 63
前后端问题,vue生命周期函数图示
在 Vue2 生命周期中最初获取 data 的阶段是 `beforeCreate`,真实 DOM 覆盖完毕的阶段是 `mounted`,模板与数据不一致的阶段是 `beforeUpdate`,销毁之前的四个阶段的生命周期函数分别是 `beforeDestroy`、`destroyed`、`deactivated` 和 `activated`。具体解释如下:
1. `beforeCreate` 钩子在实例初始化之后、数据观测 (data observer) 和 event/watcher 事件配置之前被调用,此时 data 和 methods 等实例属性还未初始化;
2. `mounted` 钩子在挂载元素 (DOM) 上之后被调用,此时实例已完成以下的配置:数据观测 (data observer),属性和方法的运算,watch/event 事件回调;
3. `beforeUpdate` 钩子在数据更新之前被调用,发生在虚拟 DOM 重新渲染和打补丁之前,可以在该钩子中进一步地更改数据;
4. `beforeDestroy` 钩子在实例销毁之前被调用,此时实例仍然完全可用;
5. `destroyed` 钩子在实例销毁之后被调用,此时所有的事件监听器都被移除,所有的子实例也已经被销毁;
6. `activated` 钩子在 keep-alive 组件激活时调用;
7. `deactivated` 钩子在 keep-alive 组件停用时调用。
阅读全文