Q-Carousel pass slide number (goTo)

manur

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

manur

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