Variables LessCSS:argb（）不处理具有动态名称的变量

我创建了一个mixin，它使用argb（）方法（用于IE过滤器梯度） 此mixin接受一个参数，用于设置要在变量列表中选择的好变量名。这些变量存储六色

@var_foo: #FFFFFF;
@var_bar: #000000;

.setColor(@colorName){
    @colorVar: ~'@{var_@{colorName}}';
    @colorArgb: argb(@colorVar);
}

这会导致以下错误： 错误求值函数

argb

：对象#没有方法“toARGB”

它似乎不喜欢转义功能。当我直接用硬编码的@var_-foo替换@colorVar时，它就起作用了。 是我做错了什么，还是argb（）方法需要一些特殊的东西

---

谢谢

您错误地调用了构造的变量名

您应该使用

@

调用

更少：

@var_foo: #FFFFFF;
@var_bar: #000000;

.setColor(@colorName) {
    @colorVar: 'var_@{colorName}';
    @colorArgb: argb(@@colorVar);
    color: @colorArgb;
}

.setColor(bar);

color: #ff000000;

将返回此CSS:

@var_foo: #FFFFFF;
@var_bar: #000000;

.setColor(@colorName) {
    @colorVar: 'var_@{colorName}';
    @colorArgb: argb(@@colorVar);
    color: @colorArgb;
}

.setColor(bar);

color: #ff000000;

---

我同意Martin的答案，但在我看来，你需要设置两个带有颜色属性的变量，他的解决方案将主颜色变量保留为字符串。因此，我建议设置一个初始getter变量，然后用于设置两个颜色变量。下面是一个例子（不知道您是如何使用颜色的，我只是把一些东西放在一起——您不太可能使用IE格式argb作为

背景色，但您明白了）：

更少

@var_foo: #FFFFFF;
@var_bar: #000000;

.setColor(@colorName) {
  @getColor: 'var_@{colorName}';
  @colorVar: @@getColor;
  @colorArgb: argb(@@getColor);
}

.test {
  .setColor(foo);
  color: @colorVar;
  background-color: @colorArgb;
}

.test2 {
  .setColor(bar);
  color: @colorVar;
  background-color: @colorArgb;
}

CSS输出

.test {
  color: #ffffff;
  background-color: #ffffffff;
}
.test2 {
  color: #000000;
  background-color: #ff000000;
}

你有一个观点，我使用
@colorVar
来保存变量名（作为getter变量）。我只是不认为需要定义另一个保存原始颜色的变量，因为您可以通过调用
@@colorVar
直接从变量
@var\u foo
和
@var\u bar
获取颜色，当然您现在可以在任何其他变量和颜色操作中使用它，取决于你到底想用它们做什么^_^