如何使用SASS映射多個值與每個功能的混入內部

Question

我有有多個值以下SASS地圖：

$map: (key: (value1, value2)); 

使用標準，如下面的每個功能正常工作：

@each $key, $value1, $value2 in $map { 
    // Do whatever here 
} 

但是，如果我嘗試使用相同的排序各功能的傳遞混入地圖中混入內部，各功能不與下面的工作：

@mixin my-mixin($map) { 

    @each $key, $value1, $value2 in $map { 
     // Do whatever here 
    }  

} 

如何使用mixin中的每個函數以及每個鍵具有多個值的地圖？

你可以看到我正在試圖做的下面，我試圖做一個mixin，它使用模塊化的規模輸出一個屬性。有使用了兩個模塊秤，一個默認爲小屏幕（移動第一）和一個較大的一個較大的屏幕：

// Output responsive modular properties 
@mixin rms-value($properties) { 

    @each $property-name, $property-ms, $property-ms2 in $properties { 

     $rem-value: ms($property-ms); 
     $px-value: rem-to-pixels($rem-value); 
     #{$property-name}: $px-value; 
     #{$property-name}: $rem-value; 


    } 

    // Secondary modular scale used for larger screens 
    @include breakpoint($breakpoint-medium) { 

     @each $property-name, $property-ms2 in $properties { 

      $rem-value: ms($property-ms2, 1rem, $ms-ratio-large); 
      $px-value: rem-to-pixels($rem-value); 
      #{$property-name}: $px-value; 
      #{$property-name}: $rem-value; 

     } 

    } 

} 

這可以隨後被用於輸出一個邊距和填充頂例如：

$properties: (
    padding-top: (1, 2), 
    margin-bottom: (2, 3), 
); 

p { 
    @include rms-value($properties); 
} 

這是工作的罰款，我只用一個單一的值在每張地圖鍵

Answer 1

你的錯誤，當是您要作爲參數傳遞的地圖變量。你應該嘗試設置混入地圖變量中，並設置作爲參數可能需要的關鍵是這樣的：

@mixin my-mixin($key) { 

    $map: (
    key1: (red, blue), 
    key2: black 
); 

    @each $key, $value in $map { 
    // do whatever 
    } 
} 

沒有功能的例子：

@mixin my-mixin($key) { 

    $map: (
    key1: 10px, 
    key2: 10em 
); 

    font-size: map-get($map, $key); 
} 

div { 
    @include my-mixin(key2); 
} 

的位置例如：http://sassmeister.com/gist/9e3741bfbddf1260500f