1. 程式人生 > >輪播元件vue

輪播元件vue

   <swiper :options="swiperOption" class='swiper-box'>                     <swiper-slide v-for="v in swipers"><img :src="v.fdcImage" class="swiper-img"                                                             style="width:100%;height:1.8rem"></swiper-slide>                     <
div class="swiper-pagination" slot="pagination"></div>

                </swiper>

安裝

npm install vue-awesome-swiper --save

首先在main.js引入

import VueSwiper from 'vue-awesome-swiper' Vue.use(VueSwiper) 然後就可以用了:   mounted () {             setTimeout(() => {                 this.asyncCount
 = 5             }, 1000)         },         data () {             return {                 swiperOption: {                     autoplay: 3000,                     pagination: '.swiper-pagination',                     autoplayDisableOnInteraction: false,                     loop: true                 },              swipers:[]     }         },