vue3 设置动态 ref vue3 设置动态 ref.................................

<template>
  <div>
    <MyComponent
      v-for="(item, index) in randomCount"
      :key="index"
      :ref="createRef(index)"
    />
  </div>
</template>
<script setup>
import { ref, computed, onMounted } from 'vue';
import MyComponent from './MyComponent.vue'; // 假设这是你的组件路径

 const refs = ref([]); // 创建一个响应式的数组来存储所有的 ref
    const randomCount = computed(() => Math.floor(Math.random() * 4) + 1); // 随机生成 1 到 4

    function createRef(index) {
      return function(el) {
        if (el) {
          refs.value[index] = el;
        }
      };
    }

    onMounted(() => {
      console.log(refs.value); // 在组件挂载后查看所有的 ref
    });
</script>