así que tengo este extraño problema, estoy tratando de vincular un elemento HTML a mi referencia en mi archivo store.ts. En la configuración del script, la referencia registra un valor nulo, pero cuando uso la configuración normal(){} funciona. Creo que mi árbitro no está expuesto a la plantilla. Lo que parece ser el problema?

 app.vue <template> <div ref="elementRef"> <p>Child of ref</p> </div> <button @click="doSomeShit">Test</button> </template> <script setup lang="ts"> import {ref, defineComponent} from 'vue' import {elementRef} from './store/store' const doSomeShit = () => { console.log(elementRef.value) } </script>

 store.ts import {ref} from 'vue' export const elementRef = ref<Maybe<HTMLElement>>(null) interface Maybe<T> { T: T | null }

Pero esto funciona

 <template> <div ref="elementRef" class="h-48 "> <p>Child of ref</p> </div> <button @click="doSomeShit">Test</button> </template> <script lang="ts"> import {ref, defineComponent} from 'vue' import {elementRef} from './store/store' export default defineComponent({ setup(){ const doSomeShit = () => { console.log(elementRef.value) } return{ doSomeShit, elementRef } } }) </script>