​

基本实现功能

1，首页轮播图

2，循环轮播

3，定时轮播


老规矩先看效果图

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


其实实现上面效果很简单，因为微信给我现成的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>

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


​

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



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