Czy funkcja SASS/SCSS/Compass ma funkcję SWITCH?

Question

Dzięki możliwości użycia zmiennych SASS, można mieć nadzieję, że istnieje duży zestaw funkcji logicznych, które możemy z nimi zrobić.

Czy istnieje sposób na zrobienie czegoś takiego?

$someVar: someValue !default; 

@switch $someVar 
{ 
    @case 'red': 
     .arbitrary-css here {} 

    @break; 

    @case 'green': 
     .arbitrary-css here {} 

    @break; 

    @case 'blue': 
     .arbitrary-css here {} 

    @break; 
} 

Jednak nie mogę znaleźć niczego w referencji SASS na ten temat.

Answer 1

Sass nie obsługuje przypadku przełączania.

Sass obsługują tylko cztery dyrektywy kontrolne:

• @if

• @for

• @Za

• @while

Answer 2

Nie, nie ma żadnej obsługiwanej instrukcji switch w sass, ale jeśli potrzebujesz tylko użyć instrukcji switch, aby zmodyfikować zmienną, możesz użyć map sass w instrukcji switch w pewien sposób.

Korzystanie Sass mapy zamiast instrukcji switch

$newVar: map-get((
    case_1_test_name : case_1_return_value, 
    case_2_test_name : case_2_return_value, 
), $testVar); 

Tak oto przykład:

$vehicle: car; 

$vehicleSeating: map-get((
    car : 4, 
    bus : 20, 
), $vehicle); 

//$vehicleSeating = 4 

Powyższy przykład języku if/else:

$vehicle: car; 

@if ($vehicle == 'car') { 
    $vehicleSeating: 4; 
} @else if ($vehicle == 'bus'){ 
    $vehicleSeating: 20; 
} 

//$vehicleSeating = 4