refs-vue-2.js

Vue.component('refs', {
    mounted() {
        console.log(this.$refs.childRef.carBrand); // Hyundai
    },
    data() {
        return {
            parentData: "Datos del componente padre",
        }
    },
    template: `
        <div>
            <h2>Refs en Vue 2</h2>
            <child ref="childRef"></child>
        </div>
    `
})

refs-vue-3.js

app.component('refs', {
    setup() {
        const childRef = ref(null);
        const parentData = ref("Datos del componente padre");
        onMounted(() => {
            console.log(childRef.value.carBrand); // Hyundai
        })
        return { childRef, parentData };
    },
    template: `
        <h2>Refs en Vue 3</h2>
        <child ref="childRef"></child>
    `
})