<!-- swiper --> <view class="page-section page-section-spacing swiper"> <swiper indicator-dots="{{indicatorDots}}" autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}"> <block wx:for="{{background}}" wx:key="key"> <swiper-item> <view class="swiper-item"> <image src="{{ item.url }}"></image> </view> </swiper-item> </block> </swiper> </view> </view>
css
.swiper{ position: fixed; 750rpx; height: 422rpx; } swiper{ height: 422rpx; }
js
data: { background: [{ key: 1, url: '../../../images/banner.png' }, { key: 2, url: '../../../images/banner.png' }, { key: 3, url: '../../../images/banner.png' }, { key: 4, url: '../../../images/banner.png' }], })
json重点"navigationStyle": "custom"
如果轮播样式在所有页面都有就放到app.json中,只有某一个页面有就单独放在那个文件下
效果