小程序swiper

使用swiper实现轮播

 index.wxml
 
 <swiper class="swiper" indicator-dots="true" autoplay="true" interval="5000" duration="1000">    
       <block wx:for="{{movies}}" wx:key="index" wx:for-index="index">    
         <swiper-item>    
           <image src="{{item.url}}" class="slide-image" mode="aspectFill"/>    
         </swiper-item>    
       </block>    
 </swiper>  
index.js

Page({
  data:{
     movies:[{url:'图片路径'},{url:'图片路径'},{url:'图片路径'}]
  }
})
index.wxss

.swiper {
  height: 400rpx;
  width: 100%;
}
.swiper image {
  height: 100%;
  width: 100%;
}

 

posted @ 2018-01-10 11:37  凉生丿墨染  阅读(176)  评论(0)    收藏  举报