Składnia warunku if / else w mieszance SCSS

Cześć, próbuję się nauczyć SASS / SCSS i próbuję zreformować mój własny mixin dla clearfix

chciałbym, żeby miksowanie było oparte na tym, czy podam szerokość miksu.

dotychczasowe przemyślenia (tylko pseudokod, ponieważ będę zawierał inne miksy)

@mixin clearfix($width) {

   @if !$width {

    // if width is not passed, or empty do this

   } @else {

        display: inline-block;
        width: $width;
   }
}

tak myślałem, że mogę to nazwać, ale to nie działa.

@include clearfix();

lub

@include clearfix(100%)

lub

@include clearfix(960px)

Byłbym wdzięczny za każdą pomoc w najlepszej lub właściwej drodze, aby to zrobić!

Możesz spróbować tego:

$width:auto;
@mixin clearfix($width) {

   @if $width == 'auto' {

    // if width is not passed, or empty do this

   } @else {
        display: inline-block;
        width: $width;
   }
}

Nie jestem pewien co do zamierzonego wyniku, ale ustawienie wartości domyślnej powinno zwrócić fałsz.

Możesz przypisać domyślne wartości parametrów w tekście podczas tworzenia miksu:

@mixin clearfix($width: 'auto') {

  @if $width == 'auto' {

    // if width is not passed, or empty do this

  } @else {

    display: inline-block;
    width: $width;

  }
}

Możesz ustawić domyślny parametr na nulllub false.
W ten sposób krótsze byłoby sprawdzenie, czy wartość została przekazana jako parametr.

@mixin clearfix($width: null) {

  @if not ($width) {

    // if width is not passed, or empty do this

  } @else {

    display: inline-block;
    width: $width;

  }
}