如何在使用动态组件时初始化组件

<template>
  <div>
    <!-- 动态组件的使用 -->
    <component :is="currentComponent"></component>

    <!-- 切换组件的按钮 -->
    <button @click="switchComponent('ComponentA')">Show Component A</button>
    <button @click="switchComponent('ComponentB')">Show Component B</button>
  </div>
</template>

<script>
import { ref } from 'vue';
import ComponentA from './ComponentA.vue';
import ComponentB from './ComponentB.vue';

export default {
  components: {
    ComponentA,
    ComponentB
  },
  setup() {
    // 定义一个响应式的数据来控制当前显示的组件
    const currentComponent = ref('ComponentA');

    // 切换组件的函数
    function switchComponent(componentName) {
      currentComponent.value = componentName;
    }

    return {
      currentComponent,
      switchComponent
    };
  }
};
</script>

const AsyncComponent = defineAsyncComponent({
  loader: () => import('./AsyncComponent.vue'),
  loadingComponent: LoadingComponent,
  errorComponent: ErrorComponent,
  delay: 200,
  timeout: 3000
});