Vue v-carousel работает только для первой инстанции

Question

У меня есть несколько карточек на странице, каждая из которых имеет диалоговое окно, которое открывает карусель изображений, относящихся к этой карточке.

Изображения показывают, когда я открываю диалоговое окно в первый раз, но затемлюбое следующее.Если я вернусь к исходному изображению, на котором показывались изображения, то теперь их нет.

В консоли нет ошибок или предупреждений.

    <v-dialog v-model="dialog" width="80vw">
      <template v-slot:activator="{ on }">
        <v-btn class="btn-info" v-on="on">More Info &rarr;</v-btn>
      </template>

      <v-card>
        <v-card-title class="headline grey lighten-2" primary-title>{{project.name}}</v-card-title>

        <v-carousel >
          <v-carousel-item v-for="(image, index) in project.images" :key="image.id" :src="image.src"></v-carousel-item>
        </v-carousel>
        <v-divider></v-divider>

        <v-card-actions>
          <v-spacer></v-spacer>
          <v-btn color="primary" flat @click="dialog=false">Close</v-btn>
        </v-card-actions>
      </v-card>
    </v-dialog>

Я ничего не вижув документации о том, как обрабатывать несколько каруселей на странице.Должны ли они иметь определенные ключи?

Answer 1

Является ли project.images каталогом, который вы пытаетесь использовать? Трудно понять проблему без раздела скрипта и того, как выглядит ваш раздел данных или реквизита.