在vue中使用swiper

1、使用npm下载vue-awesome-swiper 

npm install vue-awesome-swiper --save

2、在main.js中引用

import VueAwesomeSwiper from \'vue-awesome-swiper\'
Vue.use(VueAwesomeSwiper)
import \'swiper/dist/css/swiper.css\'（css需要单独引用）

3、在组件中使用

import { swiper, swiperSlide } from \'vue-awesome-swiper\'

export default {
  components: {
    swiper,
    swiperSlide
  }
}

html代码：

<swiper :options="swiperOption">

 <swiper-slide>1</swiper-slide>

 <swiper-slide>1</swiper-slide>

 <swiper-slide>1</swiper-slide>

</swiper>

javascript代码：

export default {
  name: \'\',
  data () {
    return {
      swiperOption:{
        slidesPerView: \'auto\',
        centeredSlides:true,
        spaceBetween: 10,
        loop:true,
        speed:600, //config参数同swiper4,与官网一致
      }
    }
  },
  components: {
    swiper,
    swiperSlide
  }

}