修改 swiper 插件

package-lock.json

@@ -2976,9 +2976,9 @@
       }
     },
     "dom7": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/dom7/-/dom7-2.1.1.tgz",
-      "integrity": "sha512-xim81hzRkIy53gWkm9pKdiflMkDA+weDafF3nmnRhwquv9vMHZ/JzYNIFbfDhEDRDkSCMSgw8cWBMumkxgOK7A==",
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/dom7/-/dom7-2.1.2.tgz",
+      "integrity": "sha512-cGwWtpu7KY3JnbREGqG4EGC/u+1hyLfWVMqrqRjmwiO8d5i4B+0imLZAQ/cJbiXnjbs0pdIUzcUyeI9BbnyKNg==",
       "requires": {
         "ssr-window": "1.0.1"
       }
@@ -8632,7 +8632,7 @@
       "resolved": "https://registry.npmjs.org/swiper/-/swiper-4.3.5.tgz",
       "integrity": "sha512-zFRvMZNFFrXGJWRSJLeD8wkHcIr5uStqk+Cv1fvPDtZxB687PurfjYgK1Ga7j7XQGm5xfCqGMSELNRSaBn36gA==",
       "requires": {
-        "dom7": "2.1.1",
+        "dom7": "2.1.2",
         "ssr-window": "1.0.1"
       }
     },

src/main.js

@@ -11,8 +11,11 @@ import '@/assets/styles/style.css'
 import '@/common/rem.js'
 import ElementUI from 'element-ui'
 import 'element-ui/lib/theme-chalk/index.css'
-import 'swiper/dist/css/swiper.css';
+//import 'swiper/dist/css/swiper.css';
 import $ from 'jquery'
+import VueAwesomeSwiper from 'vue-awesome-swiper'
+import 'swiper/dist/css/swiper.css'//这里注意具体看使用的版本是否需要引入样式，以及具体位置。
+
 
 Vue.config.productionTip = false
 Vue.use(WechatPlugin)
@@ -20,6 +23,8 @@ Vue.use(AjaxPlugin)
 Vue.use(LoadingPlugin)
 Vue.use(ToastPlugin)
 Vue.use(AlertPlugin)
+
+Vue.use(VueAwesomeSwiper, /* { default global options } */)
 //Vue.use(VueAwesomeSwiper)
 /* eslint-disable no-new */
 

src/view/home.vue

@@ -11,14 +11,17 @@
 		</div>
 		<div class="page-content">
 			<div class="banner">
-				<div class="swiper-container focus-box-swiper">
+				<!--<div class="swiper-container focus-box-swiper">
 					<div class="swiper-wrapper">
 						<div class="swiper-slide" v-for="item in bannerImgList" v-if="bannerImgList.length > 0">
 							<img :src="item.imgUrl"/>			
 						</div>
 					</div>
 					<div class="swiper-pagination"></div>
-				</div>          
+				</div>          -->
+				<swiper :options="swiperOption">
+			      	<swiper-slide v-for="item in bannerImgList" v-if="bannerImgList.length > 0"><img :src="item.imgUrl"></swiper-slide>
+			    </swiper>
 			</div>
 			<div class="coupon" >
 				<a v-if="promotionImgList != {}" :href="promotionImgList.linkUrl || ''"><img :src="promotionImgList.imgUrl"/></a>
@@ -75,6 +78,10 @@
 				promotionImgList: {}, //优惠券，
 				goodsList:[],
 				imghost: "http://medou.oss-cn-shenzhen.aliyuncs.com/",
+				swiperOption: {//swiper3
+			      autoplay: 3000,
+			      speed: 1000,
+			    }
 			};
 		},
 		components: {