Обновление переменной SASS в расширенном классе

Question

Есть ли способ обновить переменную SASS в расширенном классе? Например, у меня есть это в настоящее время:

.menu-highlight-1 { 
    $child: 1; 
    a { 
     &:nth-child(#{$child}) { 
      color: red !important; 
     } 
    } 
    } 

И я хочу, чтобы обновить $child переменные к следующему элементу, так что в моей попытке я продлил .menu-highlight-1 класс, а затем внес изменения в переменную $child. Однако все это означает выделение одного и того же элемента из расширенного класса.

.menu-highlight-2 { 
    @extend .menu-highlight-1; 
    $child: 2; 
    } 

Возможно ли это как-то?

Answer 1

Решение этой проблемы с использованием SASS mixin. Благодаря @cimmanon и эта нить: Updating variables created by lighten/darken functions by modifying the original base color afterwards

@mixin _menuHighlight($child) { 
    a { 
     &:nth-child(#{$child}) { 
     color: red !important; 
    } 
    } 
} 

    .menu-highlight-1 { 
    @include _menuHighlight(1); 
    } 

    .menu-highlight-2 { 
    @include _menuHighlight(2); 
    }