vue学习之路（二）--vue-awesome-swiper

安装：npm install vue-awesome-swiper --save

注册：

Main.js：

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

使用：

Header.vue

<template>
  <swiper :options="swiperOption">   //vue组件标签
    <swiper-slide><img src="./0.jpg"width="100%"> </swiper-slide>
    <swiper-slide><img src="./0.jpg"width="100%"> </swiper-slide>
    <swiper-slide><img src="./0.jpg"width="100%"> </swiper-slide>
  </swiper>
</template>

<script type="text/ecmascript-6">
  import{ swiper,swiperSlide } from'vue-awesome-swiper';

调用swiper
  require('swiper/dist/css/swiper.css');

调用 swiper.css
  export default{
    components: {  组件注册
      swiper,
      swiperSlide
    },
    data() {
      return{
        swiperOption: {   swiperOption是上面的options值
          loop:true,
          autoplay:3000,
          autoplayDisableOnInteraction:false
        }
      };
    }
  };
</script>