微信小程序--輪播圖

<!--pages/index/index.wxml-->
<view>
      <swiper indicator-dots="true" indicator-color="green" indicator-active-color="deeppink" autoplay="true" interval="3000" duration="800">
        <block wx:for="{{swiperList}}" wx:key="unique">
          <swiper-item>
            <image src="{{item}}"></image>
          </swiper-item>
        </block>
      </swiper>
    </view>

// pages/index/index.js
data = {      
      swiperList:['../images/detail/carousel/01.jpg','../images/detail/carousel/02.jpg','../images/detail/carousel/03.jpg','../images/detail/carousel/04.jpg']
    }

 

// pages/index/index.css
swiper{
  width:100%;
  height:400rpx;
}
swiper image{
  width:100%;
  height:100%;
}