Fix:2887 【商城小程序】村屋资讯-多个视频资讯可同时播放(优化为点击下一个视频播放时,上一个视频自动停止)

This commit is contained in:
modendeveloper
2024-12-18 23:23:47 +08:00
parent 40431f03fc
commit 27c95042d4
2 changed files with 28 additions and 2 deletions
+2 -1
View File
@@ -484,7 +484,8 @@ export default {
isLoadGoodListoSuccess: false, isLoadGoodListoSuccess: false,
isLoadInfoListSuccess: false, isLoadInfoListSuccess: false,
pageKeyId: '', pageKeyId: '',
shareImg: '' shareImg: '',
videoPlayers: []
} }
}, },
// 必须在页面加 onPageScroll(e){} ,才能滑动显示背景 // 必须在页面加 onPageScroll(e){} ,才能滑动显示背景
@@ -33,6 +33,7 @@
object-fit="contain" object-fit="contain"
play-btn-position="center" play-btn-position="center"
class="video" class="video"
id="coverVideo"
/> />
</view> </view>
</view> </view>
@@ -175,6 +176,8 @@
controls controls
play-btn-position="center" play-btn-position="center"
class="video-item" class="video-item"
:id='"video-item" + index'
@play="handleVideo(item, index)"
/> />
</view> </view>
<view v-else> <view v-else>
@@ -239,7 +242,8 @@ export default {
// 资讯 // 资讯
infoArray: [], infoArray: [],
isLoadInfoListSuccess: false, isLoadInfoListSuccess: false,
pageKeyId: '' pageKeyId: '',
videoPlayers: []
} }
}, },
onPageScroll(e) { onPageScroll(e) {
@@ -252,6 +256,27 @@ export default {
this.getInfoReq() this.getInfoReq()
}, },
methods: { methods: {
handleVideo(item, index) {
if(item.type === 2) {
const coverCtx = uni.createVideoContext('coverVideo', this)
coverCtx.pause()
const playerId = 'video-item' + index
if(this.videoPlayers.includes(playerId)) {
this.videoPlayers.forEach(player => {
if(player === playerId) return
const playerCtx = uni.createVideoContext(player, this)
playerCtx.pause()
})
} {
this.videoPlayers.push(playerId)
this.videoPlayers.forEach(player => {
if(player === playerId) return
const playerCtx = uni.createVideoContext(player, this)
playerCtx.pause()
})
}
}
},
getShopDetailReq() { getShopDetailReq() {
const _this = this const _this = this
getCountyFamousVillageDetail(_this.id).then((res) => { getCountyFamousVillageDetail(_this.id).then((res) => {