Tengo un componente vue con 2 ranuras (ambas están llenas) y necesito obtener la posición relativa a la página (usando el método getBoundingClientRect , por ejemplo), pero no puedo acceder a la ranura watchable incluso con refs . ¿Hay alguna forma de hacerlo sin el método this.$el.querySelector ?
<template> <div class="watchable-container"> <slot name="watchable" ref="refWatchable"></slot> <div class="bubble-container"> <div class="bubble"> <slot name="content"> </slot> </div> <div class="bubble-tail"></div> </div> </div> </template> <script> export default { name: "BubblePopover", mounted() { console.log(this.$slots) console.log(this.$refs); }, } </script>El miembro this.$slots debería funcionar.
this.$slots.watchable // or this.$slots.watchable.$el Intente usar nextTick en su función montada para dar tiempo de ranura para renderizar.
mounted() { nextTick(()=>{ // your code here }) } También puede agregar una identificación desde el contenido de su tragamonedas, agregar acceso a ella por getElementById
Otra opción es usar el complemento API de composición y luego acceder al contenido desde la ref.