Мастер-классы по Javascript Екатеринбург Ростов-на-Дону Москва Узнать больше...
Содержание (скрыть) Содержание (показать)

Компонентная архитектура [в работе]

Статья - в процессе написания. Всё будет дописано, но позже.

Компонентная архитектура даёт возможнсть строить масштабируемые приложения со множеством компонент, когда один вложен в другой.

Здесь будут описаны два принципа для создания сложных приложений:

  1. Вложенная структура компонент.
  2. Событийная модель, дерево не знает о соседях.

Дальше — пока не готово

Страница состоит из компонент.

На верхнем уровне — «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
  • Пункты контекстного меню могут зависеть от элемента.
  • Шаблонизация.

Решение


Комментарии

  1. Приветствуются комментарии, содержащие дополнения и вопросы по статье, и ответы на них.
  2. Если ваш комментарий касается задачи -- откройте её в отдельном окне и напишите там.
  3. Комментарии без смысла, с рекламой или не о статье вообще - удаляются.
Наверх

Содержание

Реклама

Нашли опечатку?

Нашли опечатку на сайте? Что-то кажется странным?
Выделите соответствующий текст и нажмите Ctrl+Enter!

Последние Комментарии

Помоги другим!

Помоги другим узнать о хорошей статье!