分享vue里swiper的一些坑

import Swiper from 'swiper';
import 'swiper/dist/css/swiper.min.css';

　　

　　　　
(for循环)(tip: 可以把for循环换成正常展示图片,如下面展示方法,每张图对应的放进去,分页器是可以用的,for循环这样分页器是无法显示与切换的)
　　　　(当然,你也可以根据上面for循环里有几条数据添加几个这个div,img路径可有可无,有也不会展示,分页器是根据swiper-slide判断显示与切换轮播的)
　　
　　
(分页器)
 

mounted () {
　　var that = this;
　　that.$nextTick(function(){
　　　　var mySwiper = new Swiper(".swiper-container",{ 
　　　　　　direction:"horizontal",/*横向滑动*/ 
　　　　 　　loop:true,形成环路（即：可以从最后一张图跳转到第一张图 
　　　　　　pagination:".swiper-pagination",/*分页器*/ 
　　　　 　　autoplay:3000/*每隔3秒自动播放*/ 
　　　　});
　　})
 },

import VueAwesomeSwiper from 'vue-awesome-swiper'
Vue.use(VueAwesomeSwiper)

import Swiper from 'swiper';
import 'swiper/dist/css/swiper.min.css';

　　
　　　　
　　
　　
 (分页器)

swiperOption: {
　　pagination: '.swiper-pagination',
　　paginationClickable: true,
　　autoplay: 2500,
　　autoplayDisableOnInteraction: false,
　　loop: false,
　　coverflow: {(轮播图切换方式)
　　　　rotate: 30,
　　　　stretch: 10,
　　　　depth: 60,
　　　　modifier: 2,
　　　　slideShadows : true
　　}
},

require('swiper/dist/css/swiper.css')
import VueAwesomeSwiper from 'vue-awesome-swiper'
Vue.use(VueAwesomeSwiper)

swiperOption: {
 pagination: '.swiper-pagination',
 paginationClickable: true,
 autoplay: 2500,
 autoplayDisableOnInteraction: false,
 loop: false,
 coverflow: {
　　rotate: 30,
　　stretch: 10,
　　depth: 60,
　　modifier: 2,
　　slideShadows : true
　　}
 },