YZProjectCloud/yanzhu-bigscreen/src/App.vue

<template>
  <div id="app">
    <!--大屏背景-->
    <background-video></background-video>
    <!--大屏内容-->
    <div class="screen-content-max">
      <screen-header :nav="1" v-if="!isMap"></screen-header>
      <div class="main-app">
        <router-view />
      </div>
    </div>
  </div>
</template>
<script>
import backgroundVideo from './components/backgroundVideo.vue'
export default {
  components:{
    backgroundVideo,
  },
  data(){
    return {
      isMap:false
    }
  },  
  mounted(){
    window.app=this;
    this.isMap=location.hash.indexOf("#/map")>=0;
    
    // 监听全屏事件，控制body的overflow样式
    this.$bus.$on('fullscreen', (isFullscreen) => {
      if (isFullscreen) {
        // 进入全屏时隐藏body滚动条
        document.body.style.overflow = 'hidden';
      } else {
        // 退出全屏时恢复body滚动条
        document.body.style.overflow = 'auto';
      }
    });
  },
  beforeDestroy() {
    // 清理事件监听
    this.$bus.$off('fullscreen');
  }
}
</script>