Me gustaría usar glidejs dentro de un componente vuejs , aunque hasta ahora no pude hacerlo funcionar.
¿Es posible lograr esto? ¿ vuejs admite tal cosa?
mi código:
<template> <div> <div class="glide"> <div class="glide__track" data-glide-el="track"> <ul class="glide__slides"> <li class="glide__slide">0</li> <li class="glide__slide">1</li> <li class="glide__slide">2</li> </ul> </div> <div class="glide__arrows" data-glide-el="controls"> <button class="glide__arrow glide__arrow--left" data-glide-dir="<">prev</button> <button class="glide__arrow glide__arrow--right" data-glide-dir=">">next</button> </div> </div> </div> </template> <script> import Glide from '@glidejs/glide' new Glide('.glide').mount() // this is probably wrong export default { name: 'Carousel', } </script> <style scoped> @import '../assets/styles/glide/glide.core.min.css'; </style>La solución principal que se necesita en su código es mover la inicialización de Glide al gancho mounted() , que se ejecuta cuando el componente se ha montado en el documento, lo que permite encontrar el selector .glide proporcionado al constructor Glide :
<script> import Glide from '@glidejs/glide' export default { mounted() { new Glide('.glide').mount() }, } </script>