map-get() 失效主因是键名非字面量标识符或双引号字符串;必须用 map-keys() 配合 .each() 遍历;嵌套 map 需分步提取并用 isdefined() 检查。

Less 4.0 中的 map 不是 JavaScript 对象,不能用点号或方括号语法读取;必须用 map-get(),且键名必须严格匹配(含大小写、空格、引号),否则返回 undefined。
为什么 map-get($colors, primary) 有时不生效?
常见错误是把键名当变量或字符串混用。Less 的 map-get() 第二个参数必须是**字面量标识符或带引号字符串**,不能是未定义变量。
-
map-get(@colors, primary)✅ 键名为标识符primary -
map-get(@colors, "primary")✅ 键名为双引号字符串 -
@key: primary; map-get(@colors, @key)❌@key是变量,不是字面量,解析失败 -
map-get(@colors, 'primary')❌ 单引号字符串在 Less 4.0+ 中不被识别为合法键名(仅支持双引号或无引号标识符)
如何安全遍历 Map 并生成 CSS 类?
Less 不支持直接 .each(@map),必须先用 map-keys() 拆出键列表,再用 .each() 遍历该列表 —— 这是唯一稳定可行的方式。
-
@keys: map-keys(@colors);获取所有键名组成的 list -
.each(@keys) { @key: extract(@keys, index(@keys, @value)); @val: map-get(@colors, @key); }注意:回调参数@value是当前键名(字符串),不是键值对 - 避免在
.each内部嵌套map-get()时传错参数,比如写成map-get(@colors, @value)是对的,但写成map-get(@colors, @value[0])会报错(@value不是 list)
嵌套 Map 怎么取值?
Less 4.0+ **不支持路径式访问**,如 map-get($theme, "light" "colors" "primary") 或 $theme["light"]["colors"]["primary"] 均非法。必须分步提取:
- 先取外层:
@light-theme: map-get($theme, "light"); - 再取中层:
@light-colors: map-get(@light-theme, "colors"); - 最后取值:
@primary: map-get(@light-colors, "primary"); - 任何一层返回
undefined,后续调用就会中断,建议用isdefined()做存在性检查
最易被忽略的是键名的“字面量性”:哪怕只多一个空格、换一种引号、或试图用变量间接引用,map-get() 就静默失败。调试时优先用 unit(map-get(...), "") 或拼接进注释输出,确认是否真拿到了值。

















