Question

我在尝试使Sass @for循环与我设置的spacer值变量映射一起工作时遇到一些问题。

通常，下面的代码可以正常工作，不确定是不是我的不安还是实际上我做错了什么。

这是我的Sass地图：

$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);
   }
}

Sass Map和For循环未编译

1 个答案: