1
<swiper class="swiper" indicator-dots="true"autoplay="false" interval="2000" duration="500" >
<block wx:for="{{backImage}}" wx:for-index="index">
<swiper-item>
<image src="{{item.url}}" class='slide-image' mode='aspectFill'></image>
</swiper-item>
</block>
</swiper>
2
Page({
data: {
backImage: [
{ url: '../../images/yyqx/1.jpg' },
{ url: '../../images/yyqx/2.jpg' },
{ url: '../../images/yyqx/3.jpg' },
],
},
onShareAppMessage() {
return {
title: 'swiper',
path: 'page/component/pages/swiper/swiper'
}
},
changeIndicatorDots() {
this.setData({
indicatorDots: !this.data.indicatorDots
})
},
changeAutoplay() {
this.setData({
autoplay: !this.data.autoplay
})
},
intervalChange(e) {
this.setData({
interval: e.detail.value
})
},
durationChange(e) {
this.setData({
duration: e.detail.value
})
},
onload:function(){}
})
3
.swiper{
width: 1000rpx;
height: 60%;
}
.slide-image{
width: 1000rpx;
height: 600rpx;
}