vue-mobile-table/src/utils/index.js

移动端表格、列表组件，支持虚拟滚动

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')) {
    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;
}



function getScreenDPI() {
  let HDPI = window.screen.height * getRatio() / 100   //乘以缩放比例为真实的像素
  let WDPI = window.screen.width * getRatio() / 100    //乘以缩放比例为真实的像素
  return {
    HDPI, WDPI
  }
}


export function transformPX(value) {
  if (!value) {
    return ''
  }
  value = Number(value)
  let ratio = getScreenDPI().WDPI / 100

  return (value * getRatio() / 100 / ratio) + 'vw'
}


export function getWidth(column, defaultFixItemWidth) {
  let result = transformPX(column.width)
  if (!result) {
    if (column.fixed) {
      result = defaultFixItemWidth;
    }
  }
  return result
}
export function getMinWidth(column) {
  if (column.minWidth) {
    return transformPX(column.minWidth);
  }
  return ''
}
export function getFlex(column) {
  if (!getWidth(column) || getMinWidth(column)) {
    return "1 0 0"
  }
  return 'none'
}

export function getAlign(align) {
  switch (align) {
    case 'left':
      return "flex-start"
    case "right":
      return "flex-end"
    case "center":
      return "center"
    default:
      return "flex-start"
  }
}