薩斯地圖產生的變量名

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)