页面放大,设置zoom后错位

1,032 阅读1分钟

获取到页面缩放比率,设置缩放:

<div id="app" :style="'zoom:'+setZoom()">
setZoom() {
  return 100 / getRatio();
},

此时页面上的echarts,el-select或错位; echarts错位:

<div id="chart" :style="setChartZoom()">
setChartZoom() {
  let num = 100 / getRatio();
  return {'zoom': 1 / num, 'transform': 'scale(' + num + ')'}
}

el-select错位:
popper-append-to-body=>是否将弹出框插入至 body 元素。在弹出框的定位出现问题时,可将该属性设置为 false; 日期时间选择器,同理; 组件太多也可直接修改ele代码;

//todo: 修改ele代码之后tooltip失效,不知哪里引发的,具体改了哪里忘球了;--未解决;

//todo: 下拉的弹出框插不插入body中,大部分地方无影响;但若下拉所在父元素设置了overflow,内容较多时,下拉的弹出框会被遮挡,需滚动才能看全; --未解决; 可设置select的定位为:position:unset; 这样子元素absolute就能突破父元素的overflow;但是仍有bug, --未解决;