首页 > 解决方案 > 如何在 SASS 中检查地图的索引?

问题描述

我的地图包含属性,并且在每个属性中都有一个值,但是我需要检查属性和值是否在此列表中,但是我得到以下信息error

"message": "The color correct does not exist!"

这是我的代码:

$default-color-type-list: 'border-color', 'background-color', 'color';
$default-color-name-list: (
    'cream-1': #FAFAFA,
    'cream-2': #EFEFEF,
    'correct': #02C22B,
    'dark-blue-1': #3897F0,
    'dark-grey-2': #999999,
    'incorrect': #EE2D3E,
    'transparent': transparent,
    'white': white,
);

@mixin getColor($color-name, $color-type) {
    @debug $default-color-name-list;
    @if not index($default-color-name-list, $color-name) {
        @error 'The color #{$color-name} does not exist!';
    }

    @if not index($default-color-type-list, $color-type) {
        @error 'The color type #{color-name} does not exist!';
    }
}

标签: sass

解决方案


它实际上不是一个 sass 列表,而是一个 sass 地图。

要检查密钥是否存在于地图中:

map-has-key($default-color-name-list, cream-1)

在你的情况下

@mixin getColor($color-name, $color-type) {        
    @if not map-has-key($default-color-name-list, $color-name) {
        @error 'The color #{$color-name} does exist!';
    } 

    @if not index($default-color-type-list, $color-type) {
        @error 'The color type #{color-name} does not exist!';
    }
}

推荐阅读