Swiper 设置 slidesPerView 后 slide 宽度太大？轻松解决！

如果 Swiper 设置了 slidesPerView 后 slide 宽度太大，可以通过设置其他参数来调整 slide 宽度。

1. 设置 spaceBetween 参数：通过增加 spaceBetween 参数的值可以在 slide 之间增加间距，从而减小 slide 的宽度。

var swiper = new Swiper('.swiper-container', {
  slidesPerView: 3,
  spaceBetween: 10
});

2. 设置 slidesPerGroup 参数：通过设置 slidesPerGroup 参数的值为大于 1 的整数，可以将多个 slide 放在一个 slide 的宽度内显示，从而减小 slide 的宽度。

var swiper = new Swiper('.swiper-container', {
  slidesPerView: 1,
  slidesPerGroup: 3
});

3. 设置 breakpoints 参数：通过在不同的屏幕宽度下设置不同的 slidesPerView 值，可以根据屏幕宽度调整 slide 的宽度。

var swiper = new Swiper('.swiper-container', {
  slidesPerView: 3,
  breakpoints: {
    768: {
      slidesPerView: 2
    },
    480: {
      slidesPerView: 1
    }
  }
});

通过以上方法可以根据需要调整 Swiper 的 slide 宽度，以适应不同的布局和屏幕宽度。