Vue.js 是否可以使用 VuetifyVueJS 为轮播设置默认图像而不是第一个图像

目前，我必须使用VuentiFy和VueJS实现一个 carousel ，但我需要将默认图像设置为不同于数组的第一个元素，这取决于某些条件.

具体地说，我有一个与Slide Model的一个元素(包含图像的模型)相关的 comments 模型(一些信息).此幻灯片还通过其他元素与其他幻灯片相关联.因此，当我需要查看某个 comments 时，我必须显示其对应的幻灯片以及与该 comments 对应的所有幻灯片in order，但将直接相关的幻灯片显示为默认(或初始幻灯片).

例如，注释N与12张幻灯片数组中的7号幻灯片相关.因此，在 carousel 中，应该展示12张幻灯片，但开头的焦点应该放在7号幻灯片上.

在组件中，我有类似以下内容的内容:

<script setup lang="ts">
import { isNullOrUndefined } from '@core/utils/index'
import API_MEDIA_URL from '@/plugins/media_url'
import api from '@axios'
...
const props = defineProps(['comments', 'evalmode'])

const openedPanels = ref<number[]>([])
const slides = ref()

onMounted(() => {
  openedPanels.value = [0]

  api.get(`comment/slides/${props.comments[0].id}`).then(response => {
    slides.value = response.data
  })
})

watch(props, (newQ) => {
  openedPanels.value = [0]
})
</script>

<template>
...
<VExpansionPanels
  v-if="!isNullOrUndefined(slides) && 
    !isNullOrUndefined(props.comments)"
  multiple 
  v-model="openedPanels"
  >
  <VExpansionPanel
    v-for="comment in props.comments"
    :key="comment.id"
    v-model="openedPanels"
    >
      <v-row>
        <v-col>
          <v-card-actions class="justify-center">
            <v-carousel hide-delimiters :progress="true">
              <v-carousel-item
                v-for="(slide,i) in slides"
                  :key="i"
                  :src="API_MEDIA_URL+slide.src"
                  cover
                  ></v-carousel-item>
            </v-carousel>
          </v-card-actions>
        </v-col>
      </v-row>
  </VExpansionPanel>
</VExpansionPanels>
...
</template>