解决VUE在浏览器全屏下监听不到Esc键盘事件

实测可以在谷歌、火狐、360 浏览器使用

解决了在浏览器全屏下监听不到键盘Esc事件

解决了取消全屏和全屏的同步问题，ESC按键下可以同步

以下是完整的代码，

//
data() {
      return {
         fullscreen: false,
      }
},
created(){
	let that = this
	window.onresize = function(){
	  if(!that.checkFull()){
		// 退出全屏后要执行的动作
		console.log("退出全屏")
	  }
	}
},

 methods:{
		checkFull() {
      //判断浏览器是否处于全屏状态 （需要考虑兼容问题）
      //火狐浏览器
      let isFull = document.mozFullScreen ||
        document.fullScreen ||
        //谷歌浏览器及Webkit内核浏览器
        document.webkitIsFullScreen ||
        document.webkitRequestFullScreen ||
        document.mozRequestFullScreen ||
        document.msFullscreenEnabled
      if (isFull === undefined) {
        isFull = false
      }
      return isFull;
    },

// 全屏&退出全屏
    toggleFullSceen() {
      let doc = document.documentElement
      if (this.isFullScreen) {
        // 退出全屏
        if (document.webkitExitFullscreen) {
          //Chrome等
          document.webkitExitFullscreen()
        } else if (document.mozCancelFullScreen) {
          //FireFox
          document.mozCancelFullScreen()
        } else if (document.exitFullscreen) {
          //W3C
          document.exitFullscreen()
        } else if (document.msExitFullscreen) {
          //IE11
          document.msExitFullscreen()
        }
      } else {
        if (doc.webkitRequestFullScreen) {
          // chorme等
          doc.webkitRequestFullScreen()
        } else if (doc.mozRequestFullScreen) {
          // FireFox
          doc.mozRequestFullScreen()
        } else if (doc.requestFullscreen) {
          // W3C
          doc.requestFullscreen
        } else if (doc.msRequestFullscreen) {
          //IE11
          doc.msRequestFullscreen()
        }
      }
      this.isFullScreen = !this.isFullScreen
    },
}

参考资料：https://www.it610.com/article/1296862890581630976.htm