一以下是Vue 3中主要的选项式生命周期钩子：

    beforeCreate(){

        // 初始化数据之前，创建之前，这个时候可以阻断创造该虚拟DOM

        console.log("beforeCreate")

    },

    created(){

        // 数据创建成功了，当前组件可以去服务器获取当前需要的数据，但是这个数据一般是长期不
        变，变化较少的数据

        console.log("created")

    },

    beforeMount(){

        // 当挂载之前取数据，一般会取当前需要的数据，这个数据可能会因为不同时间是有变化，经常
        变化的数据

        console.log("beforeMount")

    },

    mounted(){

        // 挂载之后，当挂载之后我们可以通过ref获取到真实的DOM元素

        console.log("mounted")

    },

    beforeUpdate(){

        // 当数据发生改变时可以在这里先判断是否更新数据符合需求，如果不符合需求，就先将数据完
        成需求然后更新，

        // 这样可以减少更新的频率

        console.log("beforeUpdate");

        // if(this.count%2===0){

        //     this.count+=1;

        // }

    },

    updated(){

        // 更新完成后，我们可以获取到最新变化的ref对应的真实DOM

        console.log("updated")

        if(this.count%2===0){

            this.count+=1;

        }

    },

    beforeUnmount(){

     // 卸载前，可以在这里判断是否需要卸载，数据的清除，事件的删除，如果不希望卸载可以通知
        阻断

        console.log("beforeUnmount")

    },

    unmounted(){

        // 卸载后，这里根据当前组件卸载后让新的内容产生替代或者处理其他部分内容，下一步等等

        console.log("unmounted")

    }

二、vue3中组合式生命周期

在Vue 3中，组合式 API 使用 `setup` 函数作为组件的生命周期钩子的替代。Vue 3 引入了新的生命周
期钩子，它们是通过 `on` 函数调用的。以下是Vue 3中常用的组合式生命周期钩子：

1.  `onBeforeMount` - 组件挂载之前调用。
2.  `onMounted` - 组件挂载之后调用。
3.  `onBeforeUpdate` - 组件更新之前调用。
4.  `onUpdated` - 组件更新之后调用。
5.  `onBeforeUnmount` - 组件卸载之前调用。
6.  `onUnmounted` - 组件卸载之后调用。
7.  `onActivated` - 组件被 keep-alive 激活时调用。
8.  `onDeactivated` - 组件被 keep-alive 停用时调用。
9.  `onErrorCaptured` - 捕获子组件的错误时调用。

-

在Vue中，挂载指的是虚拟DOM与真实DOM建立关系，让Vue实例控制页面中的某个区域的过程。
在Vue中，这个概念被用来描述Vue实例如何与页面中的DOM元素建立联系，从而控制和操作页面。