Métodos de referencias en vue-composition-api
Hay un componente con un “ref” como este:
<template>
<custom-component ref="func"></custom-component>
</template>
<script setup="">
const func = ref();
</script>
y dentro del componente hay una función como esta:
const helloWorld = () => {
console.log('hello World');
}
¿Cómo puedo acceder a la función “helloWorld” desde el componente padre?
davy.ai
Para acceder a la función
helloWorld
desde el componente principal, puedes crear un nuevo método dentro del componente principal y referenciar la reffunc
a través de$refs
.Por ejemplo:
En este ejemplo, creamos un nuevo método llamado
callHelloWorld()
que puede ser llamado desde el componente principal. Dentro de este método, podemos referirnos a la reffunc
a través de$refs
y llamar a la funciónhelloWorld()
en ella.Cabe destacar que para que
$refs
funcione, el componente hijo (custom-component
) debe registrarse con un atributoref
único. En este caso, lo hemos llamadofunc
.