如何在 less js 中使用变量作为出现在括号前的命令？

Question

如何在 less js 中将变量用作出现在 ( 括号或圆括号之前的命令？

.breadcrumb li:nth-child(2) a       { background:  darken(@breadcrumbrootback, 5%); }
.breadcrumb li:nth-child(2) a:after { border-left-color:  darken(@breadcrumbrootback, 5%); }

我想将 darken( 更改为 @breadcrumbcolouraction(，以便根据变量选择命令（因此它可以根据值或变量变亮或变暗）。我该怎么做？

@breadcrumbcolouraction: "darken";
@breadcrumbcolouraction: "lighten";

less版本4.1.1如果我把darken改成变量@breadcrumbcolouraction，less文件会编译失败

Answer 1

Sitepoint 论坛上有人给了我答案。

我会说不。调用函数时不能使用变量代替函数名。但是，您可以定义一个变量来保存函数本身，然后根据其他变量的值使用适当的变量。您还可以在诸如分离规则集之类的东西中定义您的 darken/lighten 函数，然后将规则集应用于其他一些变量值（如果您想一次使用一整套规则，这将很有用）。

@redcolor: #FF0000;
@some-option: "darken";

@dark-set: { background: darken(@redcolor, 5%); }

.box {
  width: 100px;
  height: 100px;
}


 // Color box with dark red detached set @dark-set if option is darken
.box when (@some-option = "darken") {
  @dark-set();
}@redcolor: #FF0000;
@some-option: "darken";

@dark-set: { background: darken(@redcolor, 5%); }

.box {
  width: 100px;
  height: 100px;
}


 // Color box with dark red detached set @dark-set if option is darken
.box when (@some-option = "darken") {
  @dark-set();
}

虽然上面的代码可能看起来不像您正在寻找的那么直接，但您可以看到如何通过使用变量、保存用作选项的值的变量、保护子句和分离集，您可以应用基于别处变量值的变量属性。如果我们将 @some-option 更改为“lighten”之类的东西，我们可以为 .box 定义另一个保护子句定义，它可以应用一整套其他定义。

也许您可以找到一种方法来使用所有这些不同的机制来实现可行的解决方案。

I can’t find the when command in the less js documentation 1, as in the feature being defined and explaining what it. Where can I find it? Thank your for your help!

那是因为 link 指向函数部分。我说的是保护子句，不是函数……:)

http://lesscss.org/features/#css-guards-feature

Here's the source by Martyr2.

如何在 less js 中使用变量作为出现在括号前的命令？

How do I use a variable in less js as a command that appears before a parenthesis?

less