开启freeMode后Swiper组件无法居中幻灯片的问题求助
开启freeMode后Swiper组件无法居中幻灯片的问题求助
我最近用Swiper组件的时候碰到个头疼的问题,过来请教下各位大佬!
我的Swiper里有一堆幻灯片,没法在屏幕上一次性全部展示,所以得开启freeMode,这样在移动端滑动松手后,幻灯片能带着惯性继续滚动,体验会更顺畅。
但离谱的是,哪怕我已经在freeMode的配置里加了sticky: true,滑动停止之后,Swiper完全不会把最近的幻灯片对齐到屏幕中心,这和我预想的效果完全不一样。
下面是我当前的代码,麻烦各位帮忙看看哪里出问题了:
<Swiper slidesPerView={5} centeredSlides={true} // onSlideChangeTransitionEnd={onSlideChange} modules={[Navigation, Pagination, Scrollbar, A11y]} spaceBetween={0} navigation pagination={{ clickable: true }} scrollbar={{ draggable: true }} className={styles.swiper} touchRatio={1.5} longSwipes={true} grabCursor={true} cssMode={true} slideActiveClass={styles.selectedSlide} freeMode={{ enabled: true, momentumBounce: true, sticky: true, }} > {slides} </Swiper>
有没有大佬能指点下,开启freeMode之后,怎么才能让滑动停止时,最近的幻灯片自动居中到屏幕中心呢?
备注:内容来源于stack exchange,提问作者Luca
相关产品推荐
相关产品推荐

