SCSS/SASS - 使用BEM與SASS和屬性

我使用BEM命名我的類名，例如：.accordion，.accordion__title，.accordion__item__content。SCSS/SASS - 使用BEM與SASS和屬性

對於我創建了以下的mixin：

@mixin child_el($element) { 

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

它工作得很好，但我有一個問題，當我還需要添加屬性：

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

我試圖來實現：

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

父被讀取作爲是& [狀態=真]代替.ACC ordion

來源

2017-04-21 user3541631

有什麼理由，爲什麼你不能使用標準的'＆[狀態=真]＆__ item'語法？它受到了相當長時間的支持。 – damd

其實mixin做到這一點;但我如何解決嵌套，你能給我一個例子，我試圖實現使用＆ – user3541631

我添加了一個答案，如果我正確理解你想要的東西！ – damd

你可以重寫這個沒有混入：

.accordion { 
    display: block; 

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

輸出CSS將是：

.accordion { 
    display: block; 
} 

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

來源

2017-04-21 12:47:23 damd

SCSS/SASS - 使用BEM與SASS和屬性

回答

相關問題