国标GB28181协议客户端EasyGBS视频平台更新后界面出现滚动条是什么原因导致的？

大家知道当某一个产品在进行版本更新升级的时候，往往要耗费很大的人力和物力来进行更改和测试。我们升级新版EasyGBS时就出现了不少问题，比如视频调阅模块在小屏情况下出现滚动条的情况。下面我分两种情况来讲下这个问题。

情况一：

因为播放器是按照宽度16:9的长度来撑起高度的，而宽度在不确定的情况下，高度无法做到自适应，因此在小屏幕下，页面高度因为不确定可能超过屏幕高度或者低于屏幕高度，导致视觉上有不美观。

将播放器根据16:9来确定高度的属性，并且继承父盒子100%高度和宽度，先利用栅栏布局，做好播放器盒子布局，让宽度和高度都自适应。

 
        
          

            
          

.screen-main {
  .oneScreen {
    height: 100%;
  }
  .sixteenScreen {
    height: 25%;
  }
  .fourScreen {
    height: 50%;
  }
  .nineScreen {
    height: 33.33333333333333333333333333333%;
  }

这种情况，调整好自适应属性就能够更改滚动条的问题。

情况二：

当电脑视图为125%时，首页也会出现滚动条。因为v-chart的视图会有一个固定高度来维持视图的稳定性，我们通过栅栏布局先布局好视图盒子，然后同js获取高盒子高度，然后赋值给chart视图。

   let that = this;
    setTimeout(() => {
      let Height = document.getElementById("chartHeight");
      that.chartHeight = `${Height.clientHeight - 10}px`;
    }, 200);

修改之后也将解决EasyGBS出现滚动条的问题：

视频相关解决方案均可访问TSINGSEE青犀视频，可以联系我们获取演示方案，直观感受，也可自行进行下载及测试。