問題描述

自定義的視屏控制欄，有全屏按鈕，全屏事件已寫好，但是進入全屏后底部控制欄的事件就無效了，點擊無效，表現(xiàn)出來的是視頻的播放、暫停事件?？刂茩诒緛硎强床灰姷?，用了z-index提高層級。

問題出現(xiàn)的環(huán)境背景及自己嘗試過哪些方法

本來以為是事件的冒泡，結(jié)果阻止事件冒泡后，也沒用；最后發(fā)現(xiàn)全屏后，我設置的點擊事件根本沒觸發(fā)。

相關代碼

// 請把代碼文本粘貼到下方（請勿用圖片代替代碼）

      <video-player  class="video-player-box"
                 ref="videoPlayer"
                 :options="playerOptions"
                 :playsinline="true"
                 customEventName="customstatechangedeventname"
                 @play="onPlayerPlay($event)"
                 @pause="onPlayerPause($event)"
                 @ended="onPlayerEnded($event)"
                 @waiting="onPlayerWaiting($event)"
                 @playing="onPlayerPlaying($event)"
                 @loadeddata="onPlayerLoadeddata($event)"
                 @timeupdate="onPlayerTimeupdate($event)"
                 @canplay="onPlayerCanplay($event)"
                 @canplaythrough="onPlayerCanplaythrough($event)"
                 @statechanged="playerStateChanged($event)"
                 @ready="playerReadied"
                 @on-change="progressChange"
                 >
  </video-player> 
  
  <div class="fullScreen vjs-fullscreen-control vjs-control vjs-button" 
                             aria-live="polite"  @click="fullScreenHandle" aria-disabled="false">
                            全屏
                        </div>

//全屏

        fullScreenHandle(){
            console.log('111111')
            if(!this.player.isFullscreen()){  
                this.player.requestFullscreen();  
                this.player.isFullscreen(true);  
            }else{  
                this.player.exitFullscreen();  
                this.player.isFullscreen(false);  
            }  
        },

你期待的結(jié)果是什么？實際看到的錯誤信息又是什么？

希望全屏后，自己定義的事件能正常執(zhí)行?，F(xiàn)在錯誤就是事件沒被觸發(fā)