vue-awesome-swiper学习笔记

1、npm install vue-awesome-swiper --save

2、全局引入main.js中

             import Vue from 'vue'

             import VueAwesomeSwiper from 'vue-awesome-swiper'

              import 'swiper/dist/css/swiper.css'

             Vue.use(VueAwesomeSwiper, /* { default global options } */)

3、组件内引用

 /*组件方式引用*/import 'swiper/dist/css/swiper.css'这里注意具体看使用的版本是否需要引入样式，以及具体位置。import { swiper, swiperSlide } from 'vue-awesome-swiper'export default {components: {swiper,swiperSlide}

图片轮播出现空白

 observer:true,//修改swiper自己或子元素时，自动初始化swiper  
 observeParents:true,//修改swiper的父元素时，自动初始化swiper  

常用的区域滚动设置

options:{

         direction : 'vertical',

         mousewheel: true,

       freeMode : true,

     slidesPerView : 'auto',

}