微信小程序轮播中的current_微信小程序轮播功能

————————————————

/* swiper {

height: 421.5rpx;

} */

swiper-item image {

width: 100%;

height: 100%;

}

.swiper-container{

width: 100%;

position: relative;

}

.swiper-container .swiper{

height: 300rpx;

}

.swiper-container .swiper .img{

width: 100%;

height: 100%;

}

————————————————

const app = getApp()

Page({

data: {

swiperCurrent: 0,

indicatorDots: true,

autoplay: true,

interval: 3000,//自动切换时间间隔

duration: 800,//滑动动画时长

circular: true,//是否采用衔接滑动

imgUrls: [

'../../img/index/1.jpeg',

'../../img/index/2.jpeg',

'../../img/index/3.jpeg'

]

},

//轮播图的切换事件

swiperChange: function (e) {

this.setData({

swiperCurrent: e.detail.current

})

//console.log(e.detail.current);

},

//点击指示点切换

chuangEvent: function (e) {

this.setData({

swiperCurrent: e.currentTarget.id

})

},

//点击图片触发事件

swipclick: function (e) {

console.log(this.data.swiperCurrent);

wx.switchTab({

url: this.data.links[this.data.swiperCurrent]

})

},

})

————————————————

您可以选择一种方式赞助本站支付宝转账赞助

分享到各大网站