阻止Vue轮播图片在加载时滑入

Question

当我加载显示v-carousel的页面时，它会通过从右向左滑动来加载图像。像下面的图片。

如何摆脱这种刷卡？我希望将图像加载到位，然后单击按钮将其移至下一张图像。

加载时：最初是白色

然后通过从右向左滑动来加载图像。

Answer 1

如果您希望幻灯片没有任何过渡就很简单，只需执行以下操作：

<v-carousel-item
    v-for="(item,i) in items"
    :key="i"
    :src="item.src"
    reverse-transition="none"
    transition="none"
  ></v-carousel-item>

Answer 2

我不知道这是不是正确的方法，但这就是我解决问题的方法：

     <template>
        <v-carousel v-if="show"
          :cycle="cycle"
        >
          <v-carousel-item
            v-for="(item,i) in items"
            :key="i"
            :src="item"
          ></v-carousel-item>
        </v-carousel>
     <template>
     <script>
        export default {
          data () {
            return {
              cycle: false
            }
          }
        }
     </script>

Answer 3

这不是默认行为 当您的轮播项目组件以错误的方式锁定时，可能会发生

例如： 错误（每当图片ID更改时，都会触发重新渲染）：

<v-carousel-item
   v-for="(productImage, index) in productImages"
   :key="productImage.id"
>

右：

<v-carousel-item
   v-for="(productImage, index) in productImages"
   :key="index"
>