Сергей Максимов — bem-mvc, или как клеить моделей
TRANSCRIPT
bem-mvc, или как клеить моделейСергей МаксимовBEMup в рамках YaC 2013, Москва
Яндекс.Директ
Особенности
Формы с большим количеством полей
Поля формы могут зависеть друг от друга
Полем формы может быть сложный элемент (другая форма)
Все данные нужно валидировать
2
i-bem, anybody?
3
i-bem block
Еще один велосипед
Почему велосипед?
Требования
декларативность
i-bem ориентированность
автоматизация рутинных действий
Доработка существующих решений была бы равносильна разработке собственной.
6
Составные части
7
M i-model модели, неймспейс BEM.MODEL
V * любой i-bem блок
C i-glueблок “проклеивающий”
модель и DOM-представление
Ммм... модели
Модели. Декларация
9
Модели. Декларация
10
Модели. Валидация
11
Модели. Создание
12
Модели. Создание
13
Модели. Хранилище
14
Модели. Работа с полями
15
Поля модели. ТипыПростые
string
number
boolean
Составные
array
model
model-list16
Модели. События
17
i-glue
i-glue
Блок баннер
20
Биндинги. i-glue
21
Биндинги. i-glue
22
Биндинги. i-glue
23
Биндинги. model-field
24
Биндинги. model-field
25
Биндинги. model-field
26
Биндинги. Типы model-field
Контролы
input
select
checkbox
View
inline
mod
27
Биндинги. Почему не data-атрибуты?
28
Примиксованные блоки позволяют
Не обходить весь DOM
Работать с биндингом, как с i-bem блоком
Просто создавать собственные
DEMO
Спасибо