Skip to content

readCssLengthVar

读取 CSS 自定义属性长度(支持 rem / px),失败时返回 fallback 像素值。

前置依赖

依赖参数

参数名类型说明
options.getPropertyValue(propertyName: string) => string读取 CSS 变量原始值,通常来自 getComputedStyle
options.rootFontSizePxnumber可选,解析 rem 时的根字号,默认 16

函数签名

typescript
function readCssLengthVar(
  name: string,
  fallbackPx: number,
  options: {
    getPropertyValue: (propertyName: string) => string
    rootFontSizePx?: number
  },
): number

参数

参数名类型必填说明
namestringCSS 变量名,如 '--launcher-topbar-height'
fallbackPxnumber变量缺失或无法解析时的像素回退值
options.getPropertyValuefunction注入的 DOM 读取函数
options.rootFontSizePxnumberrem 换算基准,默认 16

返回值

类型说明
number解析后的像素长度

工作原理

  1. 调用 getPropertyValue(name)trim;空字符串返回 fallbackPx
  2. rem 结尾:解析浮点数后乘以 rootFontSizePx
  3. px 结尾:直接解析浮点数。
  4. 否则尝试解析裸数字;任一环节非有限数则回退 fallbackPx