Element ref dos not work on components

[Straider71]

I have developed a component with vue new setup syntax named basepopup like following:

<template>
    <teleport to="body">
        <div class="popup-wrapper" v-show="popupShow" ref="popup">
            <slot></slot>
        </div>
    </teleport>
</template>

<script setup>
...
</script>

and in another component I am using that, like this:

<template>
....
            <div class="tag" v-for="(tag, idx) in showPop ? limitTaskTags : taskTags" :key="tag.id" :ref="el => putIn(el, smartpopups, idx + 2)">
                <span class="ellipse" :style="{ color: tag.color.replace(/[^,]+(?=\))/, '1') }">
                    ⬤
                    <span v-if="showPop" class="tooltip">
                        {{ tag.text }}
                    </span>
                </span>
                <span v-if="!showPop">{{ tag.text }}</span>
            </div>
        <BasePopup :targets="smartpopups" v-if="showPop" ref="popper">
            <SmartTagBase @click.stop />
        </BasePopup>
</template>

and in the usage area, when I want to use the popper, I will get undefined. And I also have tried the same solution using old syntaxt like this:

<template>
    <teleport to="body">
        <div class="popup-wrapper" v-show="popupShow" ref="popup">
            <slot></slot>
        </div>
    </teleport>
</template>

<script>
    export default {
         setup(){...}
    }
</script>

and it works fine. And also mention that with the older syntaxt which was using export key word also was working. And additionally, ref="popper" and :ref="el => popper = el" does not make anything change and the same problem exists.

[posva]

Hi, thanks for your interest but Github issues are for bug reports and feature requests only. You can ask questions on the forum, the Discord server or StackOverflow.

[ConductedClever]

Hi @posva , I also think that the mentioned question is a bug report about ref="..." and :ref="..." functionality on the new setup syntax. Are you sure that this is just a mistake? This issue says that ref over a pure HTML element and components with the old syntax (event new setup with exported variables) works fine and gives the el but in the latest version 3.0.3 with the setup which have removed the usage of exported variables from setup, stops working and does not set the ref.