给cover-view一个变量如isCloseBtnShow,通过v-if(不要用v-show)来控制显示隐藏。监听video全屏事件,全屏时,设置变量为false,退出全屏时再设为true,这样每次退出全屏,cover-view会重新加载。被覆盖的问题就解决了。
<video class="videoShowStyle" id="myVideo" :src="videoUrl" @fullscreenchange="playerFullScreen"
@error="videoErrorCallback" @click="closeVideo" controls>
<cover-image v-if="isCloseBtnShow" class="videoClose" @click="goback"
src="/static/icon/popupClose.png"></cover-image>
</video>
data() {
return {
isCloseBtnShow: true,
}
},
playerFullScreen(e) {
if (e.detail.fullScreen) { //全屏
this.isCloseBtnShow = false
} else { //非全屏
this.isCloseBtnShow = true
}
},