sass mixin参数 - 检查模式

Question

如何检查传递给mixin的所有参数是否都是相同的值？

伪代码：

@mixin cols($width...) { 
    @if (all $width values are the same) { 
    // do something 
    } 
} 

.three-cols { 
    @include cols(4,4,4); 
} 

Answer 1

我委托检查，看看是否值等于function然后可以从mixin，使他们都被称为任务有单一的责任。

@function check_values($values...) { 
    $counter: 0; 
    @if (nth($values, 1) != nth($values,2)) { 
    $counter: 0; 
    } 
    @else { 
    $counter: $counter + 1; 
    @for $i from 2 to length($values) { 
     $counter: if(nth($values, $i) == nth($values, $i + 1), $counter + 1, $counter); 
    } 
    } 
    @return if($counter + 1 == length($values), true, false) 
} 

的function返回或者真正或假，可以在任意数量的ARGS

@debug check_values(2,2,1,1,2,2); //false 
@debug check_values(2,2,2); //true 
@debug check_values(2,2,2,1); //false 

的function只需要在mixin

@mixin cols($width...) { 
    @if (check_values($width...)) { 
    // do something 
    } 
} 

被称为中使用

希望这会有所帮助

Answer 2

萨斯支持and，or，并not操作者为布尔值。

你可以做

@if ($width_1 == $width_2 and $width_2 == $width_3){ 
    // do something 
} 

这里更多：Using multiple conditions (AND) in SASS IF statement