1.获取屏幕缩放比例

//获取屏幕缩放比例
function getRatio()
{
    var ratio=0;
    var screen=window.screen;
    var ua=navigator.userAgent.toLowerCase();
 
    if(window.devicePixelRatio !== undefined)
    {
        ratio=window.devicePixelRatio;    
    }
    else if(~ua.indexOf('msie'))  // IE10之前包含mise，谈论IE旧版本的缩放比例
    {
        if(screen.deviceXDPI && screen.logicalXDPI)
        {
            ratio=screen.deviceXDPI/screen.logicalXDPI;        
        }
    
    }
    else if(window.outerWidth !== undefined && window.innerWidth !== undefined)
    {
        ratio=window.outerWidth/window.innerWidth;
    }
 
    if(ratio)
    {
        ratio=Math.round(ratio*100);    
    }
    return ratio;
}

2.获取分辨率

   屏幕分辨率的高：window.screen.height*getRatio()/100   //乘以缩放比例为真实的像素
   屏幕分辨率的宽：window.screen.width*getRatio()/100    //乘以缩放比例为真实的像素
   屏幕可用工作区高度：window.screen.availHeight;    
   屏幕可用工作区宽度：window.screen.availWidth;

3.监听浏览器缩放

import debounce from 'lodash/debounce' // 需要安装插件
  const debouncedSearch = debounce(
    (callback: () => void) => {
      callback()
    },
    500,
    {
      trailing: true // 延迟后执行
      // leading: false // 延迟前执行
    }
  )
  
    // 监听浏览器缩放
  window.addEventListener('resize', () => {
    debouncedSearch(() => {    //也可以使用setTimeout
    // 可以写缩放的处理事件
        console.log('页面缩放变化了');
    })
  })