У меня есть слайдер (vue-glide-js), при клике на который слайды прокручиваются, но проблема в том, что при клике, метод, который прокручивает слайды: swipeSlide вызывается 2 раза, из-за этого прокручивается 2 слайда, а не 1
<template>
<div class="projects">
<div class="container">
<div class="projects__inner">
<client-only>
<vue-glide
:options="sliderOptions"
v-model="numActiveSlide"
@glide:slide-click="swipeSlide"
@glide:run-after="canSwipe = true"
@glide:run-before="canSwipe = false"
>
<vue-glide-slide
class="slider__slide"
v-for="(slide, index) in works.map((work) => work.name)"
:key="index"
>
<video
ref="videoSlide"
class="slider__slide-video"
muted
playsinline
autoplay
:src="require(`@/static/videos/${slide}`)"
></video>
</vue-glide-slide>
</vue-glide>
</client-only>
</div>
</div>
</div>
</template>
<script>
export default {
data() {
return {
works: [
{ title: "work1", name: "1920x1920.mp4" },
{ title: "work2", name: "1920x1920 (2).mp4" },
{ title: "work2", name: "IMG_8461.MP4" },
],
sliderOptions: {
perView: 1,
hoverpause: true,
keyboard: true,
animationDuration: 1000,
rewindDuration: 1000,
gap: 10,
slidesPerGroup: 1,
},
canSwipe: true,
numActiveSlide: 0,
};
},
methods: {
swipeSlide() {
if (this.canSwipe) {
this.numActiveSlide += 1;
}
},
},
};
</script>
