If child-component is a <script setup> style component,ref(null) can't get Refs

[Darma1106]

normalChild.vue

<script lang="ts">
import { defineComponent, ref } from 'vue'

export default defineComponent({
  setup() {
    const name = ref('normal-child')
    function nameChange() {
      name.value += '-change'
    }
    return { name, nameChange }
  }
})
</script>

sugarChild.vue

<script setup lang="ts">
ref: name = 'sugar-child'
function nameChange() {
  name += '-change'
}
</script>

index.vue

<template>
  <NormalChild ref="NormalChildRef" />
  <SugarChild ref="SugarChildRef" />
</template>

<script setup lang="ts">
import { onMounted, ref } from 'vue'
import NormalChild from './normalChild.vue'
import SugarChild from './sugarChild.vue'

// const NormalChildRef = ref(null)
ref: NormalChildRef = null

const SugarChildRef = ref(null)
// ref: SugarChildRef = null

onMounted(() => {
  console.log('NormalChildRef', NormalChildRef)  // => child-ref
  console.log('SugarChildRef', SugarChildRef)  // => {}  a empty object
})
</script>

if child-component is a <script setup> style component,ref(null) can't get Refs

[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.