零基础学小程序007----小程序轮播图，自动轮播，循环轮播，定时轮播

视频讲解地址：https://edu.csdn.net/course/play/9531/265552

基本实现功能

1，首页轮播图

2，循环轮播

3，定时轮播

 

老规矩先看效果图

 

其实实现上面效果很简单，因为微信给我现成的api。

这里用到了微信的swiper控件，下面简单贴出一段代码

 

<!--index.wxml-->
<view>
  <!--顶部轮播图  -->
  <swiper indicator-dots="true" autoplay="true" interval='5000' indicator-active-color="red" circular="true">
    <swiper-item>
      <image class='top-img' src='/images/aaa.jpg'></image>
    </swiper-item>
    <swiper-item>
      <image class='top-img' src='/images/bbb.jpg'></image>
    </swiper-item>
    <swiper-item>
      <image class='top-img' src='/images/ccc.jpg'></image>
    </swiper-item>
  </swiper>
</view>

其实这些在微信官方文档里都有。

 

传送门：https://mp.weixin.qq.com/debug/wxadoc/dev/component/swiper.html

 

 

 

是不是特别简单，如果你有关于微信小程序的问题。

 

视频讲解地址：https://edu.csdn.net/course/play/9531/265552

你也可以关注我的个人微信号，每天定期推送小程序最新开发技术，优秀源码，各种干货

关注上面微号回复1可以加小程序学习微信群，群里和大家交流学习，一起进步

有问题加我微信：2501902696（备注小程序）