1

我创建了一个 mixin，它使用 argb() 方法（用于 IE 滤镜渐变） 这个 mixin 带有一个参数，用于设置好的变量名称以在变量列表中进行选择。这些变量存储六色。

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

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

这导致我出现错误：错误评估函数argb：对象＃没有方法'toARGB'

似乎它不喜欢转义功能。当我直接用硬编码的@var_foo 替换@colorVar 时，它可以工作。我做错了什么，还是 argb() 方法需要一些特殊的东西？

谢谢

4

2 回答 2

1

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

您应该使用来从变量名@@中调用变量。

较少的：

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

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

.setColor(bar);

将返回此CSS：

color: #ff000000;
于 2013-06-03T20:06:35.340 回答
1

我同意 Martin 的回答，但在我看来，您需要设置两个具有颜色属性的变量，而他的解决方案将主要颜色变量保留为字符串。因此，我建议设置一个初始 getter 变量，然后用于设置两个颜色变量。这是一个示例（不知道您是如何使用颜色的，我只是在这里拼凑一些东西——您不太可能使用 IE 格式 argb 来表示background-color，但您明白了）：

较少的

@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;
}
于 2013-06-04T16:48:10.960 回答