定位问题 vue+element-ui+easyui（兼容性）

项目背景：靠近浏览器窗口的各个方向（左上、下、左、右）都有不同的模态框悬浮于窗口，这里针对于底部组件定位的选择（主要针对pc端垂直方向上的定位）

1、百分比：easyui的window窗口定位方式：设置left和top的值即可；（left可直接写指定值px；top不能写px，因为各个分辨率下的浏览器窗口距离上面的值是不固定的。考虑到此top值写成百分数，原以为百分数可以解决此问题了，结果在不同屏幕大小的浏览器窗口中依然有细微差距）

 

2、js：easyui的window窗口只能设置left和top的值，然而top值不好设置，于是想到使用js获取当前浏览器窗口的可见高度，再使用该高度减去操作元素的高度，不就能具体定位垂直方向上的位置了？

 

created() {

  var bodyheight = Number(document.body.clientHeight); //浏览器可见窗口的高度
  var bodywidth = Number(document.body.clientWidth);//浏览器可见窗口的宽度

  console.log(bodyheight);
   //this.win.top=bodyheight-60;（60为被操作组件的高度）
},

用以上方法确实可以做到垂直方向上的指定定位，且兼容pc端不同屏幕大小。但是新的问题出现：
当改变当前浏览器窗口大小时，使用该方法实现定位的组件位置偏移得离谱，需要刷新当前窗口，才能恢复到正常状态！（效果达到了，但是用户体验极差，这样肯定不行）

3、使用定位：position:fixed/absolute;设置bottom的值，且使用px作为单位，解决了不同大小屏幕的准确定位以及不用二次刷新的问题！