SCSS/SASS - BEMとSASSを使用しています。

Question

BEMを使用してクラス名を指定しています。例：.accordion、.accordion__title、.accordion__item__content。私がしようとしている何

.accordion { 
    display: block; 
    @include child_el(item) { 
    &[state=true] { 
    @include child_el(content) { 
     display: block; 
    } 
    } 
} 
} 

：それは非常にうまく機能しているが、私はまた、追加する必要があるときに私は問題を持っている

@mixin child_el($element) { 

     &__#{$element} { 
     @content; 
     } 
    } 

属性：そのために

は、私は、次のmixinを作成しました達成する：

.accordion[state=true] .accordion__item { 
display: block; 
} 

を親が& [状態=真]の代わり.ACCあるとして読み出されますordion

Answer 1

あなたはミックスインせずにこれを書き換えることができます。

.accordion { 
    display: block; 

    &[state=true] &__item { 
    display: block; 
    } 
} 

出力CSSは次のようになります。

.accordion { 
    display: block; 
} 

.accordion[state=true] .accordion__item { 
    display: block; 
}