EBM convention de nommage de nidification - élément petit-enfant

Question

je le html follwing

<div class="listing listing--with-margin"> 
    @foreach($recipients as $recipent) 
     <span class="listing__item">{{ $recipent }} <input type="checkbox"></span> 
     <span class="listing__item">{{ $recipent }} <input type="checkbox"></span> 
    @endforeach 

Si la classe sur la case à cocher est

<input type="checkbox" class="listing__input"> 

ou

<input type="checkbox" class="listing__item listing__input"> 

Je pense que l'option 1 qui permet moi d'écrire est beaucoup plus propre dans la sass avec moins de nidification.

Answer 1

Si vous jetez un oeil à la page de nommage dans le BEM documentation, en bas, vous verrez un exemple de section, avec un bloc de formulaire. Dans l'exemple, vous trouverez l'élément <form>, avec un couple de <input /> s.

Chaque <input> a sa propre classe élément soit .form__input ou .form__submit, à la fois héritant de la classe de bloc .form. Ils n'héritent pas plus de une classe.

Cependant, vous remarquerez qu'ils ont plusieurs classes de modificateurs, ce qui est acceptable.