css - SCSS / SASS @mixin $list@各反復の問題

Question

私がリストを持っているとすると：

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

ミックスインについて、このリストを繰り返し処理できるようにしたいと思います。

@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

理解した。どうやら、このようなリストと組み合わせて使用​​する場合は、プロパティ名を補間する必要があります。それで：

悪い：

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

良い：

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