Swiper 自动播放被点击中断(尽管disableOnInteraction: false)

发布时间 2023-09-06 14:22:16作者: 千寻的小白龙

Swiper v8中,我使用了自动循环滚动,尽管设置了disableOnInteraction: false,但是并没有继续播放。后面发现是由于freeMode影响到了自动播放的执行。为了依然保持能够匀速自动播放,在freeMode保持为true的情况,添加simulateTouch: false,问题得以解决,并且自身轮播图的点击事件正常执行。

new Swiper(".partner-swiper", {
      slidesPerView: "auto",
      loop: true,
      freeMode: true,
      speed: 7000,
      autoplay: {
        delay: 0, // 初始延迟时间(毫秒)
        disableOnInteraction: false,
      },
      simulateTouch: false,
      spaceBetween: 10,
      // // 如果需要前进后退按钮
      // navigation: {
      //   nextEl: ".swiper-button-next",
      //   prevEl: ".swiper-button-prev",
      // },
      // pagination: {
      //   el: ".swiper-pagination",
      //   clickable: true,
      // },
    });
  });

记录一下,防止忘记,尽管很少使用