持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第16天，点击查看活动详情
生命周期说明
通常把一个对象从生成（new）到被销毁（destory）的过程，称为生命周期。而生命周期函数，就是在某个时刻会自动执行的函数。
按照官方的原话，就是每个 Vue 实例在被创建时都要经过一系列的初始化过程——例如，需要设置数据监听、编译模板、将实例挂载到 DOM 并在数据变化时更新 DOM 等。同时在这个过程中也会运行一些叫做生命周期钩子的函数，这给了用户在不同阶段添加自己的代码的机会。
简单来说就是每个Vue实例在被创建时都要经过一系列的初始化过程：创建实例，装载模板，渲染模板等。Vue为生命周期中的每个状态都设置了钩子函数(监听函数) 。每当Vue实例处于不同的生命周期时，对应的函数就会被触发调用。
组件的生命周期（从出生到销毁）如下图所示：
红色框区域是对应的生命周期钩子函数，如果在组件中定义了这些函数，那么就会在图中定义的位置执行这些函数。
Vue的生命周期说明
-
beforeCreate在实例初始化之后，在处理选项之前立即调用。
-
created在创建实例后调用。在实例创建完成后被立即同步调用。在这一步中，实例已完成对选项的处理，意味着以下内容已被配置完毕：数据侦听、计算属性、方法、事件/侦听器的回调函数。然而，挂载阶段还没开始，且
$elproperty 目前尚不可用。 -
beforeMount就在 DOM 开始安装之前，在挂载开始之前被调用：相关的
render函数首次被调用。 -
mount当实例被挂载（浏览器更新）时调用。实例被挂载后调用，这时
el被新创建的vm.$el替换了。如果根实例挂载到了一个文档内的元素上，当mounted被调用时vm.$el也在文档内。 -
beforeUpdate当反应性数据改变时调用，在 DOM 重新渲染之前。在数据发生改变后，DOM 被更新之前被调用。这里适合在现有 DOM 将要被更新之前访问它，比如移除手动添加的事件监听器。
-
updated当反应性数据发生变化时调用，并且 DOM 已重新渲染。当这个钩子被调用时，组件 DOM 已经更新，所以你现在可以执行依赖于 DOM 的操作。然而在大多数情况下，你应该避免在此期间更改状态。如果要相应状态改变，通常最好使用计算属性或 watcher 取而代之。
-
activated 被 keep-alive 缓存的组件激活时调用。
-
deactivated被 keep-alive 缓存的组件失活时调用。
-
errorCaptured 在捕获来自任何后代组件的错误时调用。
-
beforeDestroy在 Vue 实例被销毁之前调用。实例销毁之前调用。在这一步，实例仍然完全可用。
-
destroy在 Vue 实例被销毁后调用。
Vue3新增的生命周期函数
-
onRenderTracked - 在渲染过程中首次在渲染函数中访问反应依赖项时调用。现在将跟踪此依赖项。这有助于查看正在跟踪哪些依赖项以进行调试。
-
onRenderTriggered - 在触发新渲染时调用，允许您检查触发组件重新渲染的依赖项。
