Sass映射和For循环未编译

Question

我在尝试让Sass@for循环使用我设置的间隔值变量映射时遇到了一些问题。

通常，下面的代码会起作用，不确定是我的未经测试的想法，还是我确实做错了什么。

这是我的萨斯地图：

$spacer:   1rem;
$spacers:(
0: 0,
1: ($spacer * .25),
2: ($spacer * .5),
3: $spacer,
4: ($spacer * 1.5),
5: ($spacer * 3),
6: ($spacer * 4)
);

这是我试图开始工作的for循环：

@for $i from 0 through 6 {
.padd-top-#{$i} {
padding-top: map-get($spacers, #{$i});
}
}

我试着反复打开编译器，因为有时这会导致问题。

Answer 1

您使用的是数字，不要使用插值语法：#{ }

$spacer:   1rem;
$spacers:(
0: 0,
1: $spacer * .25,
2: $spacer * .5,
3: $spacer,
4: $spacer * 1.5,
5: $spacer * 3,
6: $spacer * 4
);
@for $i from 0 through 6 {
.padd-top-#{$i} {
padding-top: map-get($spacers, $i);
}
}