Question

我正在尝试创建一个sass mixin，它可以根据上添加的类重新定义变量的值。我停留在这个阶段（不起作用），我想知道是否最终有可能这样做：

$color-1: #9E619B;
$color-2: #BB496A;
$themecolor: red !default;
$color-themes: (
   theme1-pages:
       (
           themecolor: $color-1
       )
   theme2-pages:
       (
           themecolor: $color-2
       )
);

@each $name, $theme in $color-themes {
   body.#{$name} {
       $themecolor: map-get ($name, themecolor);
   }
}

Answer 1

我认为您遇到语法错误（map-get后有多余空格）和map-get()的参数错误：参数应为$theme和themecolor分别不是$name和themecolor：

@each $name, $theme in $color-themes {
   body.#{$name} {
       $themecolor: map-get($theme, themecolor);
   }
}

这是因为$name只是键，而$theme是对值的引用。如果您将代码的固定版本粘贴到SassMeister中：

$color-1: #9E619B;
$color-2: #BB496A;
$themecolor: red !default;
$color-themes: (
   theme1-pages:
       (
           themecolor: $color-1
       ),
   theme2-pages:
       (
           themecolor: $color-2
       )
);

@each $name, $theme in $color-themes {
   body.#{$name} {
      $themecolor: map-get($theme, themecolor);
      color: $themecolor;
   }
}

您应该希望可以将其恢复到正常状态

body.theme1-pages {
  color: #9E619B;
}

body.theme2-pages {
  color: #BB496A;
}

Sass根据主体类更改变量的值？

1 个答案: