从 SASS 嵌套列表中访问特定值答案

【问题标题】：Accessing specific value from SASS nested list从 SASS 嵌套列表中访问特定值
【发布时间】：2018-01-13 14:51:01
【问题描述】：

我有以下 sass 变量：

$color-config:(     "white":    #FFF, 
                    "black":    #303133
);

我想在不循环的情况下访问“黑色”值 (#303133)。类似的东西：

body
    color: $color-config("black")

（我知道，完全错了，只是为了解释我想要什么）

【问题讨论】：

所以你知道，这是一个列表，而不是嵌套列表。它是一层深度。

标签： css sass compass-sass

【解决方案1】：

您可以使用 SASS 的映射将元素存储在变量中。然后你使用map-get() 函数来访问它：

$color-config:(
    white: #FFF, 
    black:    #303133
);


content: map-get($color-config, white); // will return #FFF

不要使用" " 来定义键。

【讨论】：

【解决方案2】：


$color-config:(
    'white': #FFF, //quotes are important
    'black':    #303133
);

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

.white-font {
color: colors('white')
}

【讨论】：