İç içe karıştırılmış karışımlar veya işlevler SASS

Question

Bazı birimlerde, SASS'deki iç içe geçmiş karışımları veya işlevleri nasıl kullanabilirim? Böyle bir şey var:

@mixin A(){ 
    do something.... 
} 

@mixin B($argu){ 
    @include A(); 
} 

Answer 1

evet zaten Doğru yapıyor. İlk mixin ikincisini arayabilirsiniz. Bu kalemi kontrol http://codepen.io/crazyrohila/pen/mvqHo

Answer 2

Sen çok yuva Katmalar, ayrıca .. Mixins içeride yer tutucuları kullanabilirsiniz diğer cevaplar belirtildiği gibi CSS

div { 
    color: red; 
    padding: white; 
    font-size: 10px; 
    padding: 5; 
} 

Answer 3

verir

@mixin a { 
    color: red; 
} 
@mixin b { 
    @include a(); 
    padding: white; 
    font-size: 10px; 
} 
@mixin c{ 
    @include b; 
    padding:5; 
} 
div { 
    @include c(); 
} 

, sen diğer karışımlardaki karışımları içerebilir. Ayrıca, mikslerinizi de kapsayabilir.

Örnek

.menu { 
    user-select: none; 

    .theme-dark & { 
    color: #fff; 
    background-color: #333; 

    // Scoped mixin 
    // Can only be seen in current block and descendants, 
    // i.e., referencing it from outside current block 
    // will result in an error. 
    @mixin __item() { 
     height: 48px; 
    } 

    &__item { 
     @include __item(); 

     &_type_inverted { 
     @include __item(); 

     color: #333; 
     background-color: #fff; 
     } 
    } 
    } 
} 

Will çıkışı:

.menu { 
    user-select: none; 
} 

.theme-dark .menu { 
    color: #fff; 
    background-color: #333; 
} 

.theme-dark .menu__item { 
    height: 48px; 
} 

.theme-dark .menu__item_type_inverted { 
    height: 48px; 
    color: #333; 
    background-color: #fff; 
} 

Scoping Katmalar Eğer ortaya çıkan çakışma olmadan farklı kapsamları aynı adlı birden katmalar olabileceği anlamına gelir.