"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>