Considere el siguiente ejemplo simple usando la API de composición en Vue 3. Estoy tratando de tener una instancia de test disponible en las funciones de mi componente.
<script> import { defineComponent, ref, onMounted } from 'vue' export default defineComponent({ name: 'Test', setup(){ let test = ref() onMounted(() => { doSomething() }) return{ test, doSomething } } }) function doSomething(){ console.log(test) //<-- undefined console.log(this.test) //<-- undefined } </script> ¿Cómo accedo a la test dentro de doSomething() ? Según tengo entendido, todo lo que devuelva setup() debería estar disponible en todo el componente de forma similar a los atributos data() de la API de opciones.
tienes que pasar la ref como parámetro
<script> import { defineComponent, ref, onMounted } from 'vue' export default defineComponent({ name: 'Test', setup () { let test = ref(null) onMounted(() => { doSomething(test.value) }) return { test, doSomething } } }) function doSomething (param) { console.log(param); // null } </script> // functions.js import { ref } from 'vue' export let test = ref(null) // vue-file <script> import { defineComponent, ref, onMounted } from 'vue' import { test } from '../utils/functions.js' export default defineComponent({ name: 'Test', setup () { onMounted(() => { doSomething(test) }) return { test, doSomething } } }) function doSomething (param) { console.log(test.value); // <-- instant access console.log(param.value); // <-- import via parameter } </script>