Компонентная архитектура даёт возможнсть строить масштабируемые приложения со множеством компонент, когда один вложен в другой.
Здесь будут описаны два принципа для создания сложных приложений:
- Вложенная структура компонент.
- Событийная модель, дерево не знает о соседях.
Дальше — пока не готово
Страница состоит из компонент.
На верхнем уровне — «Application». Этот компонент знает про основные данные и инициализует остальные под ним.
Они инициализауют свои подкомпоненты и передают им нужную информацию. У них могут быть другие данные, не только известные «Application».
В результате получается дерево приложения.
Gmail:
<app>
<new-message-button/>
<folder-tree/>
<search>
<autocomplete/>
<submit-button/>
</search>
<right-pane>
<messages-list>
<grid/>
<paginator/>
</messages-list>
</right-pane>
</app>
Каждый компонент дерева не общается с соседями и не вызывает родителя. Он вообще не знает ничего о происходящем по бокам и сверху, изолирован от контекста по максимуму.
Если посетитель что-то делает важное, то компонент генерирует событие, на которое реагирует родитель.
TODO: Плагины вместо монолитной сборки.
[Задача в работе]
Реализуйте таблицу с редактируемыми ячейками и контекстным меню.
Требования:
- jQuery/jQueryUI.
- Компонентная архитектура.
- Редактирование ячейки по двойному клику через
input - Пункты контекстного меню могут зависеть от элемента.
- Шаблонизация.
Комментарии
- Приветствуются комментарии, содержащие дополнения и вопросы по статье, и ответы на них.
- Если ваш комментарий касается задачи -- откройте её в отдельном окне и напишите там.
- Комментарии без смысла, с рекламой или не о статье вообще - удаляются.