浏览器双屏某部分元素

vue版本
想要双击生产看板全屏生产看板页面的内容
为了防止点击的时候选中元素，则onselectstart="return false"

<template>
    <div id="MainBox" class="board_box">
        <div class="title"><span @dblclick="fullScreen" onselectstart="return false">整备生产看板</span>
        </div>
    </div>
</template>

js逻辑:
用isFullScreen来标识当前是否是全屏状态，如果全屏状态则退出全屏，如果不是则全屏。
为了防止通过esc等退出全屏，添加了monitorFull监听全屏状态变化，并更新isFullScreen

注意：MainBoxid 为我们要全屏的元素哦，自行修改id即可

 // 全屏
        fullScreen() {
    
    
            if (this.isFullScreen) {
    
    
                if (document.exitFullscreen) {
    
    
                    document.exitFullscreen()
                }
                if (document.mozCancelFullScreen) {
    
    
                    document.mozCancelFullScreen()
                }
                if (document.webkitExitFullscreen) {
    
    
                    document.webkitExitFullscreen()
                }
            } else {
    
    
                var el = document.getElementById('MainBox');
                var rfs = el.requestFullScreen || el.webkitRequestFullScreen || el.mozRequestFullScreen || el.msRequestFullscreen;
                if (typeof rfs != "undefined" && rfs) {
    
    
                    rfs.call(el);
                }
                return;
            }
        },

        /**
      * 监听页面全屏变化
      * 如果不监听全屏Esc或者F11退出状态未及时更新造成报错
      */
        monitorFull() {
    
    
            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();
            });
        },

        //判断是否是全屏
        getFullScreenStatus() {
    
    
            let ifFullScreen = !!(
                document.fullscreen ||
                document.mozFullScreen ||
                document.webkitIsFullScreen ||
                document.webkitFullScreen ||
                document.msFullScreen
            );

            this.isFullScreen = ifFullScreen;
        }