Less混合不能直接返回值，应使用Less 3.5+的function语法定义可计算、可赋值、编译期求值的函数，如getZIndex(@level) { return 1000 + (@level * 10); }。
Less混合不能直接返回值，但可以用函数替代
Less 的 .mixin() 本身不支持 return 值，它只是代码块展开，没法像 JS 函数那样赋值给变量。如果你写 @color: .my-mixin();，会报错 Operation on an invalid type 或直接编译失败。
真正能“返回值”的是 Less 内置函数（如 lighten()、contrast()）或自定义函数（需通过插件或 JavaScript 扩展），但普通 Less 项目里最可靠、零依赖的方案是：改用 function 语法（Less 3.5+ 支持）。
- 自定义函数必须以
function关键字声明，不能用.mixin - 函数名不能带点号或连字符，推荐小驼峰，如
getZIndex() - 函数体里只能用 Less 表达式和内置函数，不能写 CSS 规则或
&嵌套
用 function 实现可复用的计算逻辑
比如你想根据层级动态生成 z-index 值，又不想每次手写 1000 + @n * 10：
function getZIndex(@level) {
return 1000 + (@level * 10);
}
<p>.example {
z-index: getZIndex(3); // 编译为 z-index: 1030;
}这个 getZIndex() 是真正的函数，能参与运算、赋值、传参，且会被内联求值。注意它不是 CSS 自定义属性，也不依赖运行时 JS —— 完全在编译期完成。
立即学习“前端免费学习笔记（深入）”；
- 参数类型不校验，传字符串如
getZIndex("3")会静默转成数字（但可能出错，建议传数字） - 不能访问选择器上下文，比如拿不到当前
&的父类名 - 若函数里调用了未定义的变量，错误提示可能模糊，建议先在顶层测试
混合中“模拟返回”只适用于固定值注入
如果只是想把一组预设值（如颜色映射）塞进属性，可用带参数的混合配合 when 守卫，但本质仍是展开，不是返回：
.z-value(@n) when (@n = 1) { z-index: 100; }
.z-value(@n) when (@n = 2) { z-index: 200; }
.z-value(@n) when (@n = 3) { z-index: 300; }
<p>.example { .z-value(2); }这种方式适合枚举场景，但无法做算术、不能嵌套调用、维护成本高。一旦要加 @n = 4 就得手动补一条规则。
- 守卫条件必须是编译期可判定的，不能是变量表达式如
@n > 2（Less 不支持运行时比较） - 混合展开后会保留所有匹配分支的 CSS，除非用
!important或覆盖策略清理 - 别试图在混合里用
@return:伪变量——Less 不识别，只会当普通变量处理，不会自动注入到调用处
避免混淆：CSS 自定义属性 ≠ Less 变量/函数
有人会想用 --z-base: 1000 + calc() 模拟，但这属于运行时行为，和 Less 编译逻辑无关：
:root { --z-base: 1000; }
.example { z-index: calc(var(--z-base) + 30); }这能工作，但失去了 Less 的静态分析能力（比如你没法用它生成 class 名或媒体查询断点），而且 calc() 在旧浏览器里有兼容性风险（IE 不支持 calc() 里的 var()）。
- Less 编译阶段无法读取或修改 CSS 自定义属性的值
- 混用两种机制会让值流变得不可追踪：到底是编译时定死的，还是运行时算的？
- 真要动态 z-index，优先走
function；真要运行时响应，就该用 JS 控制style.zIndex，别硬塞进 Less
最易被忽略的一点：Less 函数的参数作用域是封闭的，外层变量不会自动继承。如果函数里要用全局配置，得显式传进去，比如 getZIndex(@level, @base: 1000) —— 少写这一个参数，默认值就可能在不同模块里不一致。
