当每个视图的幻灯片超过 1 时，滑动滑块最初不会加载

Question

我在我的网站中使用滑动滑块。

当我每个视图的幻灯片超过 1 张（例如 4 张）时，当我加载第 1 页幻灯片时，它会在滑动滑块中调整为 5 张幻灯片。

https://swiperjs.com/swiper-api

<!-- Slider main container -->
<div class="swiper">
  <!-- Additional required wrapper -->
  <div class="swiper-wrapper">
    <!-- Slides -->
    <div class="swiper-slide">Slide 1</div>
    <div class="swiper-slide">Slide 2</div>
    <div class="swiper-slide">Slide 3</div>
    ...
  </div>
  <!-- If we need pagination -->
  <div class="swiper-pagination"></div>

  <!-- If we need navigation buttons -->
  <div class="swiper-button-prev"></div>
  <div class="swiper-button-next"></div>

  <!-- If we need scrollbar -->
  <div class="swiper-scrollbar"></div>
</div>

var slider = new Swiper(".swiper-container", {
                "slidesPerView":"4",
                "slidesToScroll":1,
                "spaceBetween":15,
                "freeMode":false,
                "loop":true,
                "lazy":true,
                "preloadImages":false,
                "swiperElementNodeName": 'swiper-container',
                "autoplay": {
                    "delay": 2500
                },
                "navigation":{
                    "nextEl":".swiper-button-prev",
                    "prevEl":".swiper-button-next"
                },
                "breakpoints":{
                    "1200":{
                        "slidesPerView": 4
                    },
                    "767":{
                        "slidesPerView":2.5,
                        "freeMode":true,
                        "loop":true
                    },
                    "480":{
                        "slidesPerView":1.5
                    }
                }
            });

当页面渲染时，应计算幻灯片宽度，并且应从初始页面加载开始显示 4 张幻灯片。

Answer 1

slidePerView 必须是数字或“auto”。只需将其值从字符串“4”更改为数字 4。现在应该可以工作了。