Fix:4655 【旅居商城小程序】在首页熄屏或切换软件10秒钟以上,甄选好礼轮播商品会出现异常抖动
This commit is contained in:
+26
-10
@@ -189,7 +189,7 @@
|
|||||||
<view class="new-zone-wrap">
|
<view class="new-zone-wrap">
|
||||||
<image @click="toNewZone" class="bg-img" :src="newZone.indexBackgroundImage" mode="aspectFit|aspectFill|widthFix" lazy-load="false"></image>
|
<image @click="toNewZone" class="bg-img" :src="newZone.indexBackgroundImage" mode="aspectFit|aspectFill|widthFix" lazy-load="false"></image>
|
||||||
<view class="swiper-wrap-zx v12-mt-2">
|
<view class="swiper-wrap-zx v12-mt-2">
|
||||||
<swiper autoplay @change="changeIndex" :current="currentIndex" next-margin="40rpx" previous-margin="80rpx" circular style="width: 100%;height: 400rpx;" interval="3000" :duration="500" @animationfinish="bindSwiperInstance($event, 'newZone')">
|
<swiper :autoplay="swiperInstances.newZone" @change="changeIndex" :current="currentIndex" next-margin="40rpx" previous-margin="80rpx" circular style="width: 100%;height: 400rpx;" interval="3000" :duration="500" @animationfinish="bindSwiperInstance($event, 'newZone')">
|
||||||
<swiper-item v-for="(item, index) in newZone.indexProducts" :key="index" class="s-item" :class="{'n-actived': currentIndex !== index}">
|
<swiper-item v-for="(item, index) in newZone.indexProducts" :key="index" class="s-item" :class="{'n-actived': currentIndex !== index}">
|
||||||
<view class="zx-item" @click="goGoodsCon({id: item.productId})">
|
<view class="zx-item" @click="goGoodsCon({id: item.productId})">
|
||||||
<image :src="item.productImage" style="width: 192rpx; height: 192rpx; border-radius:10rpx"></image>
|
<image :src="item.productImage" style="width: 192rpx; height: 192rpx; border-radius:10rpx"></image>
|
||||||
@@ -459,7 +459,13 @@ export default {
|
|||||||
shareData: {},
|
shareData: {},
|
||||||
currentIndex: 0,
|
currentIndex: 0,
|
||||||
// 轮播组件实例
|
// 轮播组件实例
|
||||||
swiperInstances: {}
|
swiperInstances: {
|
||||||
|
productSwiper: true,
|
||||||
|
homestay: true,
|
||||||
|
banner: true,
|
||||||
|
festival: true,
|
||||||
|
newZone: true,
|
||||||
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
onLoad() {
|
onLoad() {
|
||||||
@@ -487,6 +493,9 @@ export default {
|
|||||||
}
|
}
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
onShow() {
|
||||||
|
this.pageToShowHandle()
|
||||||
|
},
|
||||||
onHide() {
|
onHide() {
|
||||||
this.pageToHideHandle()
|
this.pageToHideHandle()
|
||||||
},
|
},
|
||||||
@@ -511,20 +520,27 @@ export default {
|
|||||||
// 页面显示时恢复轮播
|
// 页面显示时恢复轮播
|
||||||
pageToShowHandle() {
|
pageToShowHandle() {
|
||||||
// 恢复所有轮播组件的自动播放
|
// 恢复所有轮播组件的自动播放
|
||||||
Object.values(this.swiperInstances).forEach(swiper => {
|
this.swiperInstances = {
|
||||||
swiper && swiper.autoplayStart && swiper.autoplayStart()
|
productSwiper: true,
|
||||||
})
|
homestay: true,
|
||||||
|
banner: true,
|
||||||
|
festival: true,
|
||||||
|
newZone: true,
|
||||||
|
}
|
||||||
},
|
},
|
||||||
// 页面隐藏时暂停轮播
|
// 页面隐藏时暂停轮播
|
||||||
pageToHideHandle() {
|
pageToHideHandle() {
|
||||||
// 暂停所有轮播组件的自动播放
|
this.swiperInstances = {
|
||||||
Object.values(this.swiperInstances).forEach(swiper => {
|
productSwiper: false,
|
||||||
swiper && swiper.autoplayStop && swiper.autoplayStop()
|
homestay: false,
|
||||||
})
|
banner: false,
|
||||||
|
festival: false,
|
||||||
|
newZone: false,
|
||||||
|
}
|
||||||
},
|
},
|
||||||
// 绑定轮播组件实例
|
// 绑定轮播组件实例
|
||||||
bindSwiperInstance(e, key) {
|
bindSwiperInstance(e, key) {
|
||||||
this.swiperInstances[key] = e.detail
|
// this.swiperInstances[key] = e.detail
|
||||||
},
|
},
|
||||||
changeRecommendKeyword(e) {
|
changeRecommendKeyword(e) {
|
||||||
this.keywordIndex = e
|
this.keywordIndex = e
|
||||||
|
|||||||
Reference in New Issue
Block a user