vue-awesome-swiper自动轮播

要实现vue-awesome-swiper的自动轮播，需要设置一个interval选项。你可以将interval设置为一个数字，表示自动切换的时间间隔（单位为毫秒），例如：

<swiper :options="{autoplay: {delay: 3000}}">
  // ...
</swiper>

这样就会每隔3秒自动切换到下一个轮播项。你也可以将interval设置为true，表示自动切换，并使用默认的延迟时间（默认为3000毫秒）：

<swiper :options="{autoplay: true}">
  // ...
</swiper>

记得在使用自动轮播时，还需要设置其他相关选项，例如loop（是否循环播放）、speed（切换的速度）、disableOnInteraction（是否在用户交互时停止自动轮播）等。完整的示例代码如下：

<template>
  <swiper :options="swiperOptions">
    <swiper-slide v-for="(item, index) in items" :key="index">
      <img :src="item.imgUrl" alt="">
      <div class="caption">{{item.caption}}</div>
    </swiper-slide>
  </swiper>
</template>

<script>
import { Swiper, SwiperSlide } from "vue-awesome-swiper";

export default {
  components: {
    Swiper,
    SwiperSlide,
  },
  data() {
    return {
      items: [
        {
          imgUrl: "https://picsum.photos/800/400?random=1",
          caption: "Caption 1",
        },
        {
          imgUrl: "https://picsum.photos/800/400?random=2",
          caption: "Caption 2",
        },
        {
          imgUrl: "https://picsum.photos/800/400?random=3",
          caption: "Caption 3",
        },
      ],
      swiperOptions: {
        autoplay: {
          delay: 3000,
        },
        loop: true,
        speed: 1000,
        disableOnInteraction: false,
        // 其他选项...
      },
    };
  },
};
</script>