首页轮播只有一张时不轮播

src/views/Index.vue

@@ -2,16 +2,29 @@
   <div>
     <div class="course-banner">
       <portal-header current="index" textColor="#000000" style="z-index:999; position: relative;"></portal-header>
-      <div id="container" style="z-index:99;">
+      <div id="container" style="z-index:99;" v-if="resonimg.length == 0">
-        <swiper :options="swiperOption" ref="mySwiper" v-if="resonimg.length">
+       <!-- 当轮播图等于一张时 -->
+        <swiper :options="swiperOptiontwo" ref="mySwiper" >
           <swiper-slide style="margin: 0 auto;" v-for="(item , idx ) in resonimg" :key="idx" class="swiper-slide games" :class="{'swiper-no-swiping':resonimg.length < 1}">
             <div class="bannbox" :style="{ 'background': `url(${fileBaseUrl + item.image}) no-repeat 100% / 100%`}">
             </div>
             <img class="banner-img" style=" margin: 0 auto;" :src=" fileBaseUrl + item.image" alt="">
           </swiper-slide>
-          <div class="swiper-pagination" v-if="resonimg.length > 1" slot="pagination"></div>
+          <!-- <div class="swiper-pagination"  slot="pagination"></div> -->
           <!-- <div class="swiper-button-prev" slot="button-prev"></div> -->
         </swiper>
+        </div>
+      <div id="container" style="z-index:99;" v-if="resonimg.length > 0">
+        <swiper :options="swiperOption" ref="mySwiper" >
+          <swiper-slide style="margin: 0 auto;" v-for="(item , idx ) in resonimg" :key="idx" class="swiper-slide games" :class="{'swiper-no-swiping':resonimg.length < 1}">
+            <div class="bannbox" :style="{ 'background': `url(${fileBaseUrl + item.image}) no-repeat 100% / 100%`}">
+            </div>
+            <img class="banner-img" style=" margin: 0 auto;" :src=" fileBaseUrl + item.image" alt="">
+          </swiper-slide>
+          <div class="swiper-pagination"  slot="pagination"></div>
+          <!-- <div class="swiper-button-prev" slot="button-prev"></div> -->
+        </swiper>
+       
       </div>
       <div class="personal-panel">
         <div class="personal-img">
@@ -476,11 +489,28 @@
         Popularity: [],
         scorelist: [],
         resonimg: [],
-        swiperOption: {
+         swiperOptiontwo: {
-          autoplay: {
+          autoplay: false,
-            disableOnInteraction: false,
+          noSwiping: true,
-            delay: 2000,
+          speed: 3000, //切换速度，即slider自动滑动开始到结束的时间（单位ms）
+          peed: 300, //循环速度
+          scrollbar: '.swiper-scrollbar',
+
+          pagination: {
+      	     el: '.swiper-pagination',
+            // type : 'progressbar', //分页器形状
+            clickable: true, //点击分页器的指示点分页器会控制Swiper切换
           },
+          navigation: {
+   	        nextEl: '.swiper-button-next',
+            prevEl: '.swiper-button-prev',
+          },
+        },
+        swiperOption: {
+          autoplay:{ 
+          delay:2000,
+          disableOnInteraction:false, //解决滑动后不能轮播的问题
+        }, 
           noSwiping: true,
           speed: 3000, //切换速度，即slider自动滑动开始到结束的时间（单位ms）
           loop: true, //循环切换
@@ -683,15 +713,7 @@
         let key = 'index';
         apiPlace.detail(key).then(res => {
           let lmj = JSON.parse(res.result.content)
-          if(this.resonimg.length < 1) {
+              this.resonimg = lmj;
-             this.swiperOption.autoplay = false;
-             this.swiperOption.loop = false;
-             this.swiperOption.speed = 0;
-             this.swiperOption.peed = 0;
-             this.swiperOption.freeMode = false;
-          }
-          this.resonimg = lmj
-          // console.log(this.resonimg)
         })
       },
       jumUX() {