Simplemente cambio de alpine.js a vue.js (cdn) porque experimento con funciones asíncronas. Mi objetivo es llamar a un método desde el padre que está definido en un componente.
Pero cuando quiero llamar a "prueba ()" en mi archivo html, aparece el error "No se pueden leer las propiedades de indefinido (leyendo 'childRef')" Todo funciona bien cuando el método se define en el elemento "aplicación" (padre ) pero no quiero saturar este elemento con diferentes métodos.
Gracias de antemano por cada sugerencia o comentario a mi código.
Fragmento de código Vue/Javascript
-------------------------------------- const app = Vue.createApp ({ data() { return { visible: false, openTab: '' } }, methods: { test() { this.$resfs.childRef.getMyDevices(); } } }) -------------------------------------- app.component('child',{ data() { return { myDevices: {}, } }, methods: { async getMyDevices() { const response = await foo.getMyDevices(); const data = await {...response.devices}; this.myDevices = data; } }, template: `<div ref="childRef"></div>` })Fragmento de código HTML
<div @click="test()> <child ref="childRef"></child> </div>Hubo un error tipográfico en su $refs accediendo:
methods: { test() { this.$refs.childRef.getMyDevices(); // $resfs befores } }Hay un error tipográfico en su pregunta, solo corrija la ortografía de las referencias
this.$refs.childRef.getMyDevices()Si lo anterior no funciona, intente usar
this.$children[0].getMyDevices()