Q-Carousel pass slide number (goTo)
-
Hello,
Could you help me change the slide to display on the q-carousel ?
I have a q-img photo gallery. When I click on an image I would like to open it in full screen in q-carousel.
Everything works except image selection.My q-carousel component is declared as :
<CarouselImage v-if="showCarousel" :carrouselImg="arrayImages" @finFullscreen="stopCarousel" />
I don’t success to modify q-carousel number “slide” var with props or access the goTo method.
I also tried to send event but the slide value not impact the visible image :
// Parent this.$root.$emit('carousel-select', pos); // Child q-carousel created() { this.$root.$on('carousel-select', this.slideSelect); }, methods: { slideSelect(num) { this.slide = num; },
Thanks for your help
Manu -
I’m not sure I used the good method, but I succeeded to change q-carousel image using “ref” and $nextTick
<CarouselImage ref="carousel" v-if="showCarousel" :carrouselImg="arrayImages" @finFullscreen="stopCarousel" /> ... methods: { showDiaporama(pos) { this.showCarousel = true; this.$nextTick(function selectSlide() { this.$refs.carousel.slide = pos; }); },
Manu