使用嵌套混合物内部的sass @each变量



我想使用sass的内置@each方法缩短此代码:

.svg-circle-full {
    @include mixinSVG((
        'svg': $svgvar-icn-circle-full,
        'isWide': false
    )...);
}
.svg-circle-empty {
    @include mixinSVG((
        'svg': $svgvar-icn-circle-empty,
        'isWide': false
    )...);
}
.svg-circle-half {
    @include mixinSVG((
        'svg': $svgvar-icn-circle-half,
        'isWide': false
    )...);
}

基本上,我需要能够从Mixinsvg Mixin内部的@each环中使用变量名。我正在尝试此操作,但是当它击中'svg'属性内的@each变量时,它正在失败:

@each $state in full, empty, half {
    .svg-circle-#{$state} {
        @include mixinSVG((
        'svg': $svgvar-icn-circle-#{$state},
        'isWide': false
        )...);
    }
}

您正在与命名的参数混在一起。

应该看起来像这样:

@each $state in triangle, square, circle {
    .svg-circle-#{$state} {
        @include mixinSVG(
        $svg: svgvar-icn-circle-#{$state},
        $isWide: false
        );
    }
}

来源:http://blog.ricardofilipe.com/post/object-arguments-in-sass

最新更新