前端 vue生命周期

beforeCreate

创建了一个空白的vue实例
data method 尚未被初始化，不可使用

created

vue 实例初始化完成，完成响应式绑定
data method 都已经初始化完成，可调用
没有开始渲染模板

beforeMounted

编译模板，调用render生成vdom
还没有开始渲染DOM

mounted

完成DOM渲染
组件创建完成
开始由 创建阶段， 进入 运行阶段

beforeUpdata

data 发生变化之后
准备更新 DOM （尚未更新DOM）

updated

data发生改变，DOM更新完成
不要再updated中修改data，可能会死循环

beforeUnmounted

组件进入销毁阶段，（还没有被销毁，可以正常使用）
可以移除、解绑一些全局事件，清除定时器，自定义事件等。

unmounted

组件被销毁了
所有子组件也都被销毁了

vue3 compositionAPI生命周期有何区别

setup 代替了 beforeCreate 和 created
使用hooks 函数的形式，如mounted 改为 onMounted

keep-alive组件的生命周期

onActivated 缓存组件被激活
onDeactivated 缓存组件被隐藏

在正常开发，挂载周期的执行顺序为：

父beforeCreate => 父created => 父beforeMount => 子beforeCreate => 子created => 子beforeMount => 子mounted => 父mounted

在数据更新阶段执行顺序为：

父beforeUpdate => 子beforeUpdate => 子updated => 父updated

在组件销毁阶段执行顺序为：

父beforeDestroy -> 子beforeDestroy -> 子destroyed -> 父destroyed