2015-11-05 2 views
0

При использовании соглашений об именах BEM следует отображать и скрывать классы, имеющие блок как часть имени?Названия классов BEM: блок - скрыть или просто скрыть?

Так что если у меня есть div.block-class, и я хочу скрыть его, должен ли он быть div.block-class.hide или div.block-class.block-class - скрыть?

ответ

0

Концепция скрытия чего-то довольно многократно используется для блокировки. Таким образом, это хороший кандидат на полезность (см. https://github.com/suitcss/suit/blob/master/doc/utilities.md). Поэтому, не имея .panel--hide и .btn--hide, вы можете получить <button class="btn u-hide">...</button> и <article class="panel u-hide">...</article>. Скрытие - это операция, которая может выполняться на любом блоке таким же образом, чтобы вместо выполнения hide в каждом блоке повторяться, мы делаем hide своей собственной функцией, которая работает на любом блоке. Похоже делать hide(panel) на языке программирования. Это удерживает блоки DRY. Единственный раз, когда я буду реализовывать функции для скрытия внутри самого блока, будет, если способ скрытия конкретного блока является уникальным для самого блока.

Также стоит отметить, что «скрыть» также можно представить как состояние (см. https://github.com/suitcss/suit/blob/master/doc/naming-conventions.md#is-stateOfComponent). Соглашением для состояний является то, что они имеют префикс «is-», как в is-hidden, или is-active. Я рекомендую прочитать http://csswizardry.com/2015/03/more-transparent-ui-code-with-namespaces/, поскольку он дает хорошее объяснение того, как государства и утилиты могут использоваться вместе с блоками.

Смежные вопросы