[Vuejs]-How to get index in Vue slots

by

0👍

In the end I was able to do it like this.

I changed @click="onChangeSlide" to @click="onChangeSlide(index)" in the parent but also had to change :on-change-slide="() => changeSlide(index)" to :on-change-slide="changeSlide" in the carousel component.

Parent component

<Carousel>
  <template #menu="{onChangeSlide}">
    <template v-for="(label, index) in args.testLabel" :key="index">
      <Button @click="onChangeSlide(index)" :label="label" :index="index" />
    </template>
  </template>
</Carousel>

Carousel component

<template>
  <div>
    <slot
      name="menu"
      :on-change-slide="changeSlide"
    />
  </div>
</template>

Leave a comment