$refs.xxx is undefined when app.mount in lifecycle

[MirrorHuang]

Version:
v3.3.x

code:

<script setup>
import { ref,onMounted,createApp,h } from 'vue'

const create = ()=>{
  const a = createApp({
    render(){
      return h(Com,{ref:'instance'})
    }
  })
  const root = a.mount(document.getElementById('a'))
  
  console.log(root.$refs.instance) 
}


onMounted(()=>{
  create()
})
</script>

<template>
  <div @click="create">button</div>
  <div id="a" ></div>
</template>

root.$refs.instance is undefined in mount but it's not in click
I want to know why