vue3中使用swiper搭建一个循环的轮播图的代码

以下是 Vue3 中使用 Swiper 搭建一个循环的轮播图的代码示例：

<template>
  <div class="swiper-container">
    <div class="swiper-wrapper">
      <div class="swiper-slide" v-for="(item, index) in list" :key="index">
        <img :src="item.imgUrl" alt="">
      </div>
    </div>
    <div class="swiper-pagination"></div>
  </div>
</template>

<script>
import Swiper from 'swiper/bundle';

export default {
  data() {
    return {
      list: [
        { imgUrl: 'https://example.com/img1.jpg' },
        { imgUrl: 'https://example.com/img2.jpg' },
        { imgUrl: 'https://example.com/img3.jpg' },
        { imgUrl: 'https://example.com/img4.jpg' },
        { imgUrl: 'https://example.com/img5.jpg' },
      ],
    };
  },
  mounted() {
    const swiper = new Swiper('.swiper-container', {
      loop: true,
      pagination: {
        el: '.swiper-pagination',
      },
    });
  },
};
</script>

<style>
.swiper-container {
  width: 100%;
  height: 100%;
}

.swiper-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
</style>

希望对你有所帮助！接下来，请问你有什么问题需要我回答吗？