Question

我尝试从mixin中更改另一个变量中使用的变量，但我无法更改变量值。

$color: white !default;
$var: "this #{$color} is a test" ;

@mixin test($value, $color) {
  // here how to override the $color value
  color: $value;
}

.a {
  @include test($var, #ccc);
}

默认情况下，$color值为白色，此$color变量用于另一个变量$var。

当我在mixin中传递$var以更改其变量（$color）值时，它不会更改。有人请为此提出解决方案吗？

预期输出：

.a {
  color: "this #ccc is a test";
}

提前致谢。

Answer 1

当您将$var变量作为参数传递时，其值不会更新，因为它已被分配。在mixin中传递新的$color变量不会更新变量。解决方法可以是使用set-nth函数将白色替换为mixin中传递的颜色：

$color: white !default;
$var: #{$color}, red;

@mixin test($value, $colour) {
  // here how to override the $color value
  $var: set-nth($value, 1, $colour);
  color: $var;
}

.a {
  @include test($var, #ccc);
}

如何更改scss mixin中另一个变量中使用的变量值

1 个答案: