Vue3的生命周期

由于本人才开始学vue3，所以一些思路以及没有用到的知识点希望各位不吝赐教
直接上代码：

<script lang="ts">
import {
  ref,
  reactive,
  toRefs,
  onBeforeMount,
  onMounted,
  onBeforeUpdate,
  onUpdated,
  onBeforeUnmount,
  onUnmounted,
  onErrorCaptured,
  onRenderTracked,
  onRenderTriggered
} from "vue";
interface DataProps {
  itemGirls: string[];
  GirlContent: string;
  GirlFun: (index: number) => void;
}

export default {
  setup() {
    const data: DataProps = reactive({
      itemGirls: ["大桥", "貂蝉", "庄周"],
      GirlContent: "",
      GirlFun: (index: number) => {
        data.GirlContent = data.itemGirls[index];
      },
    });
    // 组件挂载到页面之前
    onBeforeMount(() => {
      console.log("onBeforeMount");
    });
    // 组件挂载到页面之后
    onMounted(() => {
      console.log("onMounted");
    });
    // 组件更新之前
    onBeforeUpdate(() => {
      console.log("onBeforeUpdate");
    });
    // 组件更新之后
    onUpdated(() => {
      console.log("onUpdated");
    });
    // 组件卸载之前
    onBeforeUnmount(() => {
      console.log("onBeforeUnmount");
    });
    // 组件销毁之后
    onUnmounted(() => {
      console.log("onUnmounted");
    });
    // 捕获子组件异常
    onErrorCaptured(() => {
      console.log("onErrorCaptured");
    });
    // 状态跟踪钩子函数 跟踪响应的变量以及方法（响应的变量跟方法发生了变化之后才会执行这个钩子函数）----个人见解
    onRenderTracked((event)=>{
      console.log(event,'onRenderTracked')
    })
    //状态跟踪钩子函数  跟踪单纯的一个变量或者方法（一个变量或者方法改变了才会执行这个钩子函数）----个人见解
    //变量或者方法发生变化之后可以看到新值以及旧值，个人见解的话可以用作变量的监听
    onRenderTriggered((event)=>{
      console.log(event,'onRenderTriggered')
    })
    const RefData = toRefs(data);
    return {
      ...RefData,
    };
  },
};
</script>

目前本人所知道的也只有这么多，但是vue2的声明周期也同样可以在vue3中运行的