vue项目浏览器全屏相关

阅读 71

2022-02-28

                                                                                        

 data() {
    return {
      fullHeight: document.documentElement.clientHeight,  //页面高度
}
}


mounted() {
    let _this = this 
    if (window.outerHeight === screen.availHeight){
        if(window.outerWidth === screen.availWidth){
          this.isFullScreen = false
        }
      }else{
        this.isFullScreen = true
      }

      window.onresize = () => {
      return (() => {
        window.fullHeight = document.documentElement.clientHeight
        this.fullHeight = window.fullHeight
      })()
    }
  },
  watch:{
    fullHeight(val){  //监听是否是全屏
      if (window.outerHeight === screen.availHeight){
        if(window.outerWidth === screen.availWidth){
          this.isFullScreen = false
        }
      }else{
        this.isFullScreen = true
      }
    }
  },

精彩评论(0)

0 0 举报