javascript - 如何在 Swiper Js 中更改幻灯片时禁用单击和触摸/鼠标拖动

Question

我使用 GSAP 为 slider 添加了一些动画，这是从 Swiper JS https://swiperjs.com/ 获得的一切都运转良好，但如果用户多次点击 Swiper 导航(箭头、点或拖动)我的动画开始崩溃。所以问题是如何在幻灯片更改时禁用单击或滑动？我有简单的代码:

var modernSlider = new Swiper ('.swiper-container', {
    slidesPerView: 1,
    centerSlides: true,
    pagination: {
        el: '.swiper-pagination',
        clickable: true,
      },
    navigation: {
        nextEl: '.swiper-button-next',
        prevEl: '.swiper-button-prev',
      },
})
modernSlider.on('slideChange', function(){
        var $self = $('.swiper-slide');
        var $tSpan = $self.find('.text h1 span');
        gsap.to($tSpan, {
            duration: 0.4,
            y: '50px'
        })
})

你能帮我一下吗？提前致谢!

Answer 1

swiper 有一个名为 noSwiping 的属性，在配置对象中将其设置为 false。