首先html里要给每个.swiper-container这个class在加一个class用来辨识轮播图

比如下面的.swiper-container-v和.swiper-container-h，而.swiper-wrapper内的都是轮播图的内容，

每个.swiper-slide都代表着轮播图的一页

<div  class="swiper-container swiper-container-v">
   <div  class="swiper-wrapper">
      <div class="swiper-slide">
         <div class="swiper-container swiper-container-h">
            <div class="swiper-wrapper">
               <div class="swiper-slide">slide1</div>
               <div class="swiper-slide">slide2</div>
               <div class="swiper-slide">slide3</div>
               <div class="swiper-slide">slide4</div>
            </div>
            <div class="swiper-pagination"></div>
          </div>
        </div>
   <div class="swiper-slide">slide-h2</div>
   <div class="swiper-slide">slide-h3</div>
   <div class="swiper-slide">slide-h3</div>
   <div class="swiper-slide">slide-h5</div>
   <div class="swiper-slide">slide-h6</div>
</div>
<div class="swiper-paginations"></div>

两个或多个轮播图vue初始化命名不要一样，比如下面的swiper和swipers，其他的就自己设置了，里面的东西都不是必须的，要什么功能就自己加，不要就不要加

 var swiper = new Swiper('.swiper-container-h', {
        loop:true,//是否循环播放
        pagination: '.swiper-pagination',//小圆点的样式
        // nextButton: '.swiper-button-next',
        // prevButton: '.swiper-button-prev',
        paginationClickable: true,//点击小圆点
        setWrapperSize:true,
        spaceBetween: 0,
        centeredSlides: true,//设定当前页居中
        autoplay: false,//图片自动切换的时间
        autoplayDisableOnInteraction: false,
        grabCursor:true//使鼠标指针变为抓手
    });

    var swipers = new Swiper('.swiper-container-v',{
        pagination: '.swiper-paginations',
        direction: 'vertical',//切换方向(水平方向horizontal垂直方向vertical)
        draggable:true,//允许拖动滚动条
        setWrapperSize:true,
        spaceBetween: 0,
        centeredSlides: true,
        autoplay: false,
        autoplayDisableOnInteraction: false,
        grabCursor:true,
        mousewheelControl: true
    })