**从0到Vue3企业项目实战【05.vue生命周期】**

---

1. 什么是生命周期？

生命周期是指一个实体从创建到销毁的整个过程。在软件开发中，生命周期通常是指一个组件或对象的创建、初始化、更新和销毁过程。

2. Vue的生命周期

Vue的生命周期从组件的创建开始，一直持续到组件的销毁。在这一过程中，Vue组件会经历一系列的生命周期钩子函数，这些钩子函数可以帮助我们完成一些初始化、更新、销毁等操作。

3. Vue生命周期钩子函数

a. beforeCreate
在实例创建之前调用，此时组件实例还没有被创建，因此不能访问组件实例上的任何属性或方法。

b. created
在实例创建之后立即调用，此时组件实例已经创建，但还没有被挂载到 DOM 中。可以访问组件实例上的属性和方法。

c. beforeMount
在组件挂载到 DOM 之前立即调用，此时组件实例已经创建并已被挂载到 DOM 中。

d. mounted
在组件挂载到 DOM 之后立即调用，此时组件实例已经挂载到 DOM 中。

e. beforeUpdate
在组件更新之前立即调用，此时组件实例已经挂载到 DOM 中，并且即将被更新。

f. updated
在组件更新之后立即调用，此时组件实例已经挂载到 DOM 中，并且已经更新完毕。

g. beforeDestroy
在组件销毁之前立即调用，此时组件实例已经挂载到 DOM 中，并且即将被销毁。

h. destroyed
在组件销毁之后立即调用，此时组件实例已经从 DOM 中移除。

4. Vue生命周期管理

我们可以通过生命周期钩子函数来管理组件的生命周期。例如，我们可以通过beforeMount钩子函数来在组件挂载到 DOM 之前执行一些操作，或者可以通过beforeDestroy钩子函数来在组件销毁之前执行一些操作。

5. Vue2生命周期与Vue3生命周期

Vue2和Vue3的生命周期钩子函数基本相同，但也有几点不同：

a. Vue3中新增了两个生命周期钩子函数：beforeUnmount和unmounted。beforeUnmount钩子函数在组件卸载之前立即调用，unmounted钩子函数在组件卸载之后立即调用。

b. Vue3中，beforeCreate钩子函数被移到了setup函数之前。

6. 总结

Vue的生命周期对于理解Vue组件的运作方式和编写更高效的Vue代码非常重要。通过了解Vue的生命周期，我们可以更好地管理组件的生命周期，并在适当的时候执行适当的操作。