it-swarm.com.de

Verwenden mehrerer Bedingungen (AND) in der SASS IF-Anweisung

Mit SASS möchte ich mehrere Bedingungen in der IF-Anweisung haben

Was ich gerade benutze:

@function color-x ($alpha) {
    @if      $accent == red   {@return red($alpha)} 
    @else if $accent == green {@return green($alpha)} 
    @else if $accent == blue  {@return blue($alpha)}
}

Mein naiver (fehlgeschlagener) Versuch, mehrere Bedingungen zu verwenden:

@function color-x ($alpha) {
    @if      $accent == red   && theme == light {@return red($alpha)} 
    @else if $accent == green && theme == light {@return green($alpha)} 
    @else if $accent == blue  && theme == light {@return blue($alpha)}
}

Ist es möglich, mehrere Bedingungen zu haben?

54
500

Aus der Sass-Referenzdokumentation:

Boolesche Operationen

SassScript unterstützt die Operatoren and, or und not für boolesche Werte.

(link)

Ein if-Anweisungsausdruck mit einer zusammengesetzten Bedingung würde also so aussehen:

@if $var1 == value1 and $var2 == value2 {
    // ...
}

Darüber hinaus können Klammern verwendet werden, um die Reihenfolge der Operationen in einem komplizierteren Ausdruck zu beeinflussen:

@if ($var1 == value1 and not ($var2 == value2)) or ($var3 == value3) {
    // ...
} 
112
Russ Ferri

Sie können auch tun:

@if index("foo" "bar", $value) { .. }

Achtung:

  1. Es ist möglicherweise nicht ganz offensichtlich, was Sie versuchen zu tun.
  2. Es wird eine Zahl oder null zurückgegeben, kein Boolescher Wert.
3
Hugo Giraudel