你可以在同一個sass mixin中使用變量和可選參數嗎？

Question

我期待創建一個全局梯度混合。我的問題很多都在標題或下面的示例中。我無法在文檔或Google上找到任何內容。

@mixin gradient($fallback, $color-stops..., $dir: "") { 
    @if $dir != "" { 
    background-color: $fallback; //fallback for older browsers 
    background: -webkit-linear-gradient($dir, $color-stops); 
    background: -moz-linear-gradient($dir, $color-stops); 
    background: -o-linear-gradient($dir, $color-stops); 
    background: linear-gradient($dir, $color-stops); 
}//end if 
@else { 
    background-color: $fallback; //fallback for older browsers 
    background: -webkit-linear-gradient($color-stops); 
    background: -moz-linear-gradient($color-stops); 
    background: -o-linear-gradient($color-stops); 
    background: linear-gradient($color-stops); 
} //end else 
} 

謝謝

Answer 1

您可以同時使用，但變量參數必須放在最後：

@mixin gradient($fallback, $dir: "", $color-stops...) { ... } 

在你的情況這可能並不理想。我建議將顏色停止作爲列表傳遞給一個參數。所有你需要做的就是添加括號他們身邊：

@mixin gradient($fallback, $color-stops, $dir: "") { ... } 
@include gradient(red, (to left, red 50%, blue)); 

雖然我不知道什麼$dir說法實際上做...