vue3+ts ref获取不到 component 多个自定义组件

如果你想获取多个自定义组件的实例，可以使用 `ref` 的数组形式来声明多个变量。以下是一个获取多个组件实例的示例代码：

<template>
  <div>
    <MyComponent1 ref="myComponent1Ref" />
    <MyComponent2 ref="myComponent2Ref" />
  </div>
</template>

<script lang="ts">
import { defineComponent, ref } from 'vue';
import MyComponent1 from './MyComponent1.vue';
import MyComponent2 from './MyComponent2.vue';

export default defineComponent({
  components: {
    MyComponent1,
    MyComponent2,
  },
  setup() {
    const myComponent1Ref = ref(null);
    const myComponent2Ref = ref(null);
    
    // 在组件挂载后，通过 myComponentRef.value 获取组件实例
    const mounted = () => {
      console.log(myComponent1Ref.value);
      console.log(myComponent2Ref.value);
    };
    
    return {
      myComponent1Ref,
      myComponent2Ref,
      mounted,
    };
  },
});
</script>

在上面的代码中，我们声明了两个变量 `myComponent1Ref` 和 `myComponent2Ref`，并在模板中将两个自定义组件的引用分别赋值给了这两个变量。在 `mounted` 函数中，我们通过 `myComponent1Ref.value` 和 `myComponent2Ref.value` 分别获取了两个组件的实例。