小程序之swiper（幻灯片）

wxml代码

<swiper class="banner" indicator-dots="true" autoplay="true" interval="3000" duration="1000">
    <swiper-item wx:for="{{imgUrls}}" wx:key="{{item.id}}">
      <navigator url="{{item.action}}">
        <image src="{{item.photo}}" background-size="cover"></image>
      </navigator>
    </swiper-item>
  </swiper>

js代码
嵌套在data：{}里面
imgUrls:[

  {"id":1,"action":"#","photo":"/static/demo/1.jpg"},
  {"id":2,"action":"#","photo":"/static/demo/2.jpg"},
  {"id":3,"action":"#","photo":"/static/demo/3.jpg"}
],

wxss

.banner {
  width: 750rpx;
  height: 320rpx;
}
.banner image {
  width: 100%;
  height: 320rpx;
}