diff --git a/src/views/AIPatrol/drone/index.vue b/src/views/AIPatrol/drone/index.vue index bd086bd..d6eda86 100644 --- a/src/views/AIPatrol/drone/index.vue +++ b/src/views/AIPatrol/drone/index.vue @@ -14,17 +14,27 @@ const videoRefs = ref([]) const flvPlayers = ref([]) // 初始化视频播放器 -const initVideoPlayers = () => { +const initVideoPlayers = async () => { // 销毁之前的播放器 if (mainFlvPlayer.value) { destroyFlvPlayer(mainFlvPlayer.value) + mainFlvPlayer.value = null } - flvPlayers.value.forEach(player => destroyFlvPlayer(player)) + + flvPlayers.value.forEach(player => { + if (player) { + destroyFlvPlayer(player) + } + }) flvPlayers.value = [] + // 等待DOM更新 + await nextTick() + // 初始化主视频播放器 if (mainVideoRef.value && droneList.value[currentDroneIndex.value]?.status === 'online') { const deviceCode = droneList.value[currentDroneIndex.value].code + console.log('初始化主视频播放器:', deviceCode) mainFlvPlayer.value = createFlvPlayer(mainVideoRef.value, deviceCode) } @@ -32,6 +42,7 @@ const initVideoPlayers = () => { videoRefs.value.forEach((videoRef, index) => { if (videoRef && droneList.value[index]?.status === 'online') { const deviceCode = droneList.value[index].code + console.log('初始化列表视频播放器:', index, deviceCode) const player = createFlvPlayer(videoRef, deviceCode) flvPlayers.value.push(player) } @@ -87,11 +98,10 @@ const getList = async () => { } // 切换主视频 -const switchMainVideo = (index) => { +const switchMainVideo = async (index) => { + if (currentDroneIndex.value === index) return currentDroneIndex.value = index - nextTick(() => { - initVideoPlayers() - }) + await initVideoPlayers() } // 处理分页变化