本文是使用小程序的
swiper组件实现的方式
在wxml文件的合适位置添加swiper组件,并且根据需要显示的轮播图数量,添加对应的item,我这里是添加了2个item,代码如下:
<swiper autoplay circular duration="5000" indicator-dots style="z-index: 1;">
<swiper-item>
<image src="/images/1.png" class="heart"/>
</swiper-item>
<swiper-item>
<image src="/images/2.png" class="heart"/>
</swiper-item>
</swiper>
其中,autoplay属性设置为true表示自动播放轮播效果,circular属性设置为true表示循环播放,duration属性设置切换动画的持续时间,单位为毫秒,indicator-dots为true表示显示指示点。