JavaScript Swiper 本机导航功能不起作用

Question

我使用 swiper 在我的网站上制作滑块。不幸的是，导航在 Chrome 中不起作用。按钮出现但不执行任何操作。

这是我的代码：

 <div class="swiper-container">
    <div class="swiper-wrapper">
      <div class="swiper-slide">
      </div>
      <div class="swiper-slide">
      </div>
      <div class="swiper-slide">
      </div>
      <div class="swiper-slide">
      </div>
      <div class="swiper-slide">
      </div>
    </div>

    <div class="swiper-button-next"></div>
    <div class="swiper-button-prev"></div>
  </div>

  <script src="js/swiper/swiper.min.js"></script>

  <script>
    var swiper = new Swiper('.swiper-container', {
      navigation: {
        nextEl: '.swiper-button-next',
        prevEl: '.swiper-button-prev',
      },
      slidesPerView: 3,
      spaceBetween: 5,
      loop: true,
      centeredSlides: true,
    });
  </script>

我希望有人能帮助我，因为我找不到与此主题相关的任何信息。

原文由 philippblack 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

尝试从 Swiper 库中导入 Navigation 。然后 Swiper.use()

 import Swiper, { Navigation } from 'swiper';

Swiper.use([Navigation]);

const swiper = new Swiper(...);

原文由 ecairol 发布，翻译遵循 CC BY-SA 4.0 许可协议