微信小程序mpvue使用swiper

代码

<div class='swiper'>
  <swiper
    :indicator-dots='true'
    indicator-color='#d8d8d8'
    indicator-active-color = '#ffad36'
    :autoplay='true'
    :interval='3000'
    :duration='1000'
    :circular='true'
  >
    <a :href="'/pages/audiobook/main?id=' + img.id" v-for='img in topSwipers' :key='img.id'>
      <swiper-item>
        <img              
          class='slide-image' 
          mode='aspectFit' 
          :src="img.outterImage" 
          />
      </swiper-item>
    </a>
  </swiper>  
</div> 

topSwipers: [{
  id: 1,
  outterImage: '../../static/img/swiper/sw1.png'
},
{
  id: 1,
  outterImage: '../../static/img/swiper/sw1.png'
},
{
  id: 1,
  outterImage: '../../static/img/swiper/sw1.png'
}]

.swiper {        
    .slide-image{
        width:100%;
        height:300rpx;
    }
}

文档

原生swiper

网站导航

网站导航