v-tab中的Vuetify响应式轮播图片

Question

我试图获得一个响应式旋转木马，并带有有效的淡入淡出过渡，但是很快发现，如果您将高度设置为自动，则会弄乱过渡（下一个图像在下面闪烁），否则，您会失去响应性{ {3}}。现在，我正在尝试找到一种方法来同时获得过渡（图像被裁剪但完美过渡的第一个图像）和响应性（图像具有响应性并自动将高度填充到div的第二个图像，但过渡不正确）是的，有人建议我把它们包起来，让网格找出来。我需要一点帮助。

<v-row>
  <v-col cols="1">
    <v-btn icon large @click="toggle">
      <v-icon>{{icon}}</v-icon>
    </v-btn>
  </v-col>
  <v-col>
    <v-slider 
      color="light-green" 
      thumb-color="light-green accent-4"
      thumb-size="30"
      track-color="light-green accent-4"
      v-model="run" 
      max="2"
      :tick-labels="ticksLabels"
      tick-size="6"
      ticks/>
  </v-col>
</v-row>
<v-carousel 
  :cycle="playPause"
  interval=3000
  v-model="run"
  hide-delimiter-background
  show-arrows-on-hover 
  >
  <v-carousel-item
    transition="fade-transition"
    reverse-transition="fade-transition"
    v-for="(item,i) in items"
    :key="i"
    >
    <v-row>
      <v-spacer/>
      <img width="75%" :src="item.src"/>
      <v-spacer/>
    </v-row>

  </v-carousel-item>
</v-carousel>
<v-card>
  <v-card-text>
    {{ sampleText }}
  </v-card-text>
</v-card>