How to use @slide(index, direction) in carousel

[dsahoo]

I am trying to figure out how to use @slide(index, direction) event in carousel component to get the index of the current slide. Also, I am trying to run a callback on swipe of every carousel item to update the state with the current carousel item index

[benoitranque]

Quick example:

<q-carousel class="text-white" @slide="myAwesomeSlideMethod">
  <div slot="slide" class="bg-primary">
    Slide 1
  </div>
  <div slot="slide" class="bg-secondary">
    Slide 2
  </div>
  <div slot="slide" class="bg-tertiary">
    Slide 3
  </div>
</q-carousel>

methods: {
  myAwesomeSlideMethod (index, direction) {
    console.log(`Sliding to slide ${ index } using direction ${ direction }`)
  }
}

[dsahoo]

Thanks alot…