loading

src/views/components/carouselChart.vue

@@ -8,14 +8,16 @@
     >
       <swiper-slide
         class="slide-1"
-        v-for="item in terminalPhoto"
+        v-for="(item, index) in terminalPhoto"
         :key="item.id"
       >
         <viewer class="bigimg" v-if="item.path.indexOf('nopic') == -1">
           <!-- <img :src="item.path + '!1330x670'" alt="" /> -->
+          <img v-if="index == 0" :src="item.path + '!1330x670'" />
           <img
+            v-else
             src="../../assets/img/nopic.jpg"
-            :src="item.path + '!1330x670'"
+            :data-src="item.path + '!1330x670'"
             class="swiper-lazy"
           />
         </viewer>
@@ -84,14 +86,20 @@ export default {
         loopedSlides: 4,
         lazy: {
           loadPrevNext: true,
-          loadPrevNextAmount: 1,
+          loadPrevNextAmount: 4,
           loadOnTransitionStart: true,
+          //loadOnTransitionStart: true,
         },
-        lazyLoading: true, //懒加载开启
+        // lazyLoading: true, //懒加载开启
         navigation: {
           nextEl: ".swiper-button-next",
           prevEl: ".swiper-button-prev",
         },
+        observer: true, //修改swiper自己或子元素时，自动初始化swiper
+        observeParents: true, //修改swiper的父元素时，自动初始化swiper
+        onSlideChangeEnd: function (swiper) {
+          swiper.update();
+        },
       },
       swiperOptionThumbs: {
         spaceBetween: 10,