萨斯地图产生的变量名

Question

我在萨斯地图与键和值

$colors: (blue: #0081d2, green: #288600, orange: #e57323); 

@each $color, $value in $colors { 
    .#{$color} { 
     color: $value; 
    } 
} 

这工作，给我的CSS类名用适当的值，如：

.blue{ 
    color: #0082d1; 
} 

什么想的有一个函数可以根据地图中的键生成sass变量。

$blue: #0082d1; 
$green: #288600; 

我一直在打破我的头，但无法得到它的工作。

Answer 1

你可以创建一个函数来通过指定的键返回值。

例

$colors: (blue: #0081d2, green: #288600, orange: #e57323); 

@function color($color) { 
    @return map-get($colors, $color); 
} 

.bacon { 
    color: color(blue); 
} 

在

.bacon { 
    color: #0081d2; 
} 

Answer 2

地图的重点在于让数据以更分层的方式构建，而不仅仅是一堆变量。如果你不想要这个，首先定义变量而不是地图。

但我猜你真正想要的是一种访问地图值的方法。试试这个：

map-get($colors, blue)