vue3 swiper获取当前activeIndex
vue3 swiper获取当前activeIndex
·
1、npm install swiper
2、引入
import { Swiper, SwiperSlide } from 'swiper/vue';
import { Mousewheel, Pagination } from "swiper";
import 'swiper/css';
import "swiper/css/pagination";
3、获取
const c_swiper = document.getElementsByClassName("_swiper")
console.log(c_swiper[0].swiper.activeIndex)
4、代码
//html
<swiper class="_swiper" :slides-per-view="1" :direction="'vertical'" :modules="[Mousewheel,Pagination]"
:mousewheel="true" :pagination="{
clickable: true,
}" @swiper="onSwiper" @slideChange="onSlideChange()">
<swiper-slide>111</swiper-slide>
</swiper>
// swiper
function onSwiper(swiper) {
}
const c_swiper = document.getElementsByClassName("_swiper")
const swiperIdx = ref(0)
function onSlideChange() {
swiperIdx.value = c_swiper[0].swiper.activeIndex
}
更多推荐
已为社区贡献2条内容
所有评论(0)