vue浏览器全屏 非全屏切换 按esc退出全屏

 methods: {

　　　　// 全屏 点击按钮
        allping(){
        this.status = true;
        this.enterFullscreen();
        },
       // 缩小 点击按钮
       narrow(){
       this.status = false;
       this.exitFullscreen();
      },

// 进入全屏方法
        enterFullscreen() {
            var docElm = document.documentElement;
            //W3C
            if(docElm.requestFullscreen) {
                docElm.requestFullscreen();
            }
            //FireFox
            else if(docElm.mozRequestFullScreen) {
                docElm.mozRequestFullScreen();
            }
            //Chrome等
            else if(docElm.webkitRequestFullScreen) {
                docElm.webkitRequestFullScreen();
            }
            //IE11
            else if(docElm.msRequestFullscreen) {
                docElm.msRequestFullscreen();
            }
        },
        // 退出全屏方法
        exitFullscreen() {
            //W3C
            if (document.exitFullscreen) {
                document.exitFullscreen();
            }
            //FireFox
            else if (document.mozCancelFullScreen) {
                document.mozCancelFullScreen();
            }
            //Chrome等
            else if (document.webkitCancelFullScreen) {
                document.webkitCancelFullScreen();
            }
            //IE11
            else if (document.msExitFullscreen) {
                document.msExitFullscreen();
            }
        },
        // 判断当前页面是否全屏
    getFullScreenStatus() {
      this.status = !!(
        document.fullscreen ||
        document.mozFullScreen ||
        document.webkitIsFullScreen ||
        document.webkitFullScreen ||
        document.msFullScreen
      );
    },
},

mounted() {
// 监听浏览器全屏事件
let that = this;
document.addEventListener("fullscreenchange", function() {
that.getFullScreenStatus();
});

document.addEventListener("mozfullscreenchange", function() {
that.getFullScreenStatus();
});

document.addEventListener("webkitfullscreenchange", function() {
that.getFullScreenStatus();
});

document.addEventListener("msfullscreenchange", function() {
that.getFullScreenStatus();
});

},