SOURCE

var mySwiper = new Swiper('.swiper-container',{
//   slidesPerView : 2,  
slidesPerView : 'auto',   // 根据slide的宽度自动调整展示数量。此时需要设置slide的宽度，如下style所示
//slidesPerView : 3.7,
spaceBetween:10,
// 如果需要前进后退按钮
    navigation: {
      nextEl: '.swiper-button-next',
      prevEl: '.swiper-button-prev',
    },
})

<div class="swiper-container">
    <div class="swiper-wrapper">
        <div class="swiper-slide">
            <div class="s1">Slide 1</div>
        </div>
        <div class="swiper-slide">
            <div class="s2">Slide 2</div>
        </div>
        <div class="swiper-slide">
            <div class="s3">Slide 3</div>
        </div>
    </div>
    
    <!-- 如果需要导航按钮 -->
    <div class="swiper-button-prev"></div>
    <div class="swiper-button-next"></div>
</div>

.swiper-container {
    width: 300px;
}
.swiper-slide{
    width:auto;/*根据内容调整宽度*/
    height:200px;
  }
  .swiper-slide:first-child{
    background: red
  }
  .swiper-slide:nth-child(2){
    background: blue
  }
  .swiper-slide:last-child{
    background: green
  }
  .s1,.s2,.s3 {
      width:200px;
  }