vue中使用点击事件让浏览器全屏

1.注册点击事件 @click=“goQ”

2.data中定义是否全屏的一个布尔值

data(){
    return{
      fullscreen:false 
    }
  },

3.点击事件

goQ(){
      this.fullscreen = !this.fullscreen
      let  element  =  document.documentElement  ;   
      if(this.fullscreen){   
        if(document.exitFullscreen){  
          document.exitFullscreen();
        }else if(document.webkitCancelFullScreen){
          document.webkitCancelFullScreen();
        } else if(document.mozCancelFullScreen){  
          document.mozCancelFullScreen();
        }else if(document.msExitFullscreen){  
          document.msExitFullscreen()   ;   
        }
      }else{   
        if(element.requestFullscreen){  
          element.requestFullscreen();   
        }else if(element.webkitRequestFullScreen){  
          element.webkitRequestFullScreen();   
        }else  if(element.mozRequestFullScreen){ 
           element.mozRequestFullScreen();  
        }else if(element.msRequestFullscreen) {}
      }   
    }