【前端】vue生命周期-vue

一起养成写作习惯！这是我参与「掘金日新计划 · 4 月更文挑战」的第3天，点击查看活动详情。

Vue 实例从创建到销毁的过程，就是生命周期。也就是从开始创建、初始化数据、编译模板、挂载Dom→渲染、更新→渲染、卸载等一系列过程，我们称这是 Vue 的生命周期。

Vue 的生命周期总共分为8个阶段：创建前/后（beforeCreate、created），挂载前/后（beforeMount、mounted），更新前/后(beforeUpdate、updated)，销毁前/后（beforeDestory、destoryed）。每个阶段存在一个生命周期函数，程序员可以需求进行操作。

生命周期函数：
1 .又名：生命周期回调函数、生命周期钩子。
2. 是什么：Vue在关键时刻帮我们调用的一些特殊名称的函数。
3. 生命周期函数的名字不可更改，但函数的具体内容是程序员根据需求编写的。
4. 生命周期函数中的this指向是vm 或 组件实例对象。

图片是对vue官网图片的中文解析，摘自尚硅谷天禹老师的课程视频

常用的生命周期钩子：

1. mounted: 发送ajax请求、启动定时器、绑定自定义事件、订阅消息等【初始化操作】。

2. beforeDestroy: 清除定时器、解绑自定义事件、取消订阅消息等【收尾工作】。

   关于销毁Vue实例
   1.销毁后借助Vue开发者工具看不到任何信息。
   2.销毁后自定义事件会失效，但原生DOM事件依然有效。
   3.一般不会在beforeDestroy操作数据，因为即便操作数据，也不会再触发更新流程了。

两个新的生命周期钩子（路由组件独有）

1. 作用：路由组件所独有的两个钩子，用于捕获路由组件的激活状态。

2. 具体名字：

   1. activated路由组件被激活时触发。
   2. deactivated路由组件失活时触发。

以上是 vue2 的生命周期，vue3已有更新。