SCSS / SASS @mixin $ list @each迭代问题

Question

鉴于我有一个清单：

$box-shadow-properties: -webkit-box-shadow, -moz-box-shadow, box-shadow;

我希望能够遍历此列表中的mixin：

@mixin box-shadow-with-inset($box-shadow-params, $inset-params) {
  @each $property in $box-shadow-properties {
    $property: $box-shadow-params, $inset-params;
  }
}

所以我可以这样称呼：

@include box-shadow-with-inset(0px 1px 3px rgba(0, 0, 0, 0.25), inset 0px -1px 0px rgba(0, 0, 0, 0.1));

没有编译错误，但它没有编译到CSS文件 - 就好像它被完全忽略一样。有人有什么想法吗？

Answer 1

想出来。显然，当与这样的列表一起使用时，必须插入属性名称。所以：

BAD：

$property: $box-shadow-params, $inset-params;

GOOD：

#{$property}: $box-shadow-params, $inset-params;