vue3+ts 如何通过ref获取组件，并给出相应ts类型

在 Vue 3 + TypeScript 中，可以使用 `ref` 来获取组件实例。具体实现可以参考以下代码示例：

<template>
  <div>
    <MyComponent ref="myComponentRef" />
  </div>
</template>

<script lang="ts">
import { defineComponent, ref } from 'vue';
import MyComponent from '@/components/MyComponent.vue';

export default defineComponent({
  components: {
    MyComponent,
  },
  setup() {
    const myComponentRef = ref<MyComponent | null>(null);

    const handleClick = () => {
      if (myComponentRef.value) {
        myComponentRef.value.doSomething();
      }
    };

    return {
      myComponentRef,
      handleClick,
    };
  },
});
</script>

在上面的代码中，我们定义了一个 `MyComponent` 组件，并使用 `ref` 来获取它的引用，同时使用 TypeScript 来指定 `myComponentRef` 的类型为 `MyComponent | null`，表示它可能为空。在 `handleClick` 方法中，我们判断 `myComponentRef.value` 是否为 `null`，如果不为空则调用 `doSomething` 方法。

需要注意的是，使用 `ref` 获取组件实例时，需要在组件上添加 `ref="myComponentRef"` 属性，否则无法获取到组件实例。另外，也需要在组件的 `components` 选项中注册组件。