vue3.2 动态ref

https://blog.csdn.net/qq_42859450/article/details/127411453

//v-for设置ref及其使用
<template>
    <component v-for="item in cptArr" :key="item.type" :ref="setItemRef" :is="item.type"></component>
</template>
<script setup>
    import { ref } from 'vue'
    const cptArr = [
        {
            type: 'imgCpt',
            option: {}
        },
        {
            type: 'advCpt',
            option: {}
        }
    ]
    const itemRefs = []
    const setItemRef = el => {
        if (el) {
            itemRefs.push(el)
        }
    }
    itemRefs.forEach(item => {
        // item 即为对应的组件ref
        // 可通过 item 获取对应组件上的属性或方法
    })
</script>
posted @ 2023-02-15 16:07  Chaplink  阅读(269)  评论(0编辑  收藏  举报