微信小程序之轮播图

微信小程序之轮播图

今天记录一下微信小程序开发时，轮播图的效果时怎么实现的。话不多说，直接上代码：

<!-- 1. 首页轮播图 --><view><swiper class="my-swiper" autoplay="true" indicator-dots="true" indicator-active-color="#fff"circular="true"><block wx:for="{{imgUrls}}"><swiper-item class="sw-img"><image src="{{item}}" mode="widthFix"></image></swiper-item></block></swiper></view>

轮播，就用swiper组件，里面有很多属性，一般以下几个比较常用：

• autoplay="true"：设置自动播放
• indicator-dots="true"： 是否显示面板指示点
• indicator-active-color="#fff"： 当前选中的指示点颜色