vue3 swiper6.8快速使用

"swiper": "^6.8.2",

然后直接界面使用

<template>
  <div class="main">
    <swiper
      class="swiper-warp"
      :autoplay='{
        "delay": 2500,
        "disableOnInteraction": false
      }'
      :pagination='{ "clickable": true }'
      :scrollbar="{draggable: true}"
    >
     <!-- :direction= "vertical" -->
      <swiper-slide class="swiper-container"> 1</swiper-slide>
      <swiper-slide class="swiper-container"> 1</swiper-slide>
    </swiper>
  </div>
</template>

<script>

import 'swiper/swiper.scss'
import { Swiper, SwiperSlide } from 'swiper/vue'
import SwiperCore, { Autoplay, Pagination } from 'swiper'
import 'swiper/components/pagination/pagination.scss'
import { ref, onMounted, reactive, toRefs } from 'vue'
SwiperCore.use([Autoplay, Pagination])
export default {
  components: {
    Swiper,
    SwiperSlide
  },
  setup () {
    return {
      showTab,
      tabValue
    }
  }
}
</script>

深入了解 https://swiperjs.com/vue