如何将v-for循环中的当前项与兄弟组件进行通信

时间:2017-08-20 07:39:07

标签: ecmascript-6 vuejs2

我正在使用VueJS构建一个图库应用程序,该库的一个组件是我从Vuetify库中获取的滚动轮播。旋转木马看起来像这样 -

<v-carousel :cycle="false" icon="none">
  <v-carousel-item v-for="(image,index) in imageList" :src="image"
  :key="index">
  </v-carousel-item>
</v-carousel>

当我滚动旋转木马时,我希望显示当前图像,即将v-carousel-item的当前src绑定传递给同级组件。

我遇到将当前src提取为javascript变量的问题 - 一旦我这样做,我就可以弄清楚如何将它转移到另一个组件。

请帮忙。

1 个答案:

答案 0 :(得分:1)

<v-carousel v-model="carouselIndex">
    <v-carousel-item v-for="(src,i) in images" :src="src" :key="i"></v-carousel-item>
</v-carousel>
<span>Current Index: {{carouselIndex}}</span>