Связь между компонентами в Maquette

Question

Мой вопрос касается связи между компонентами в среде Maquette Javascript.

Представь, что у меня есть Menu субкомпонент, используемый в Application компонент: Application Экземпляр хотел бы знать, когда пункт меню выбран в Menu Например, чтобы поменять местами основной контент, отображаемый в приложении (например). Другими словами, мне нужен способ связи между дочерним компонентом и его родительским компонентом. Как это может быть достигнуто в Maquette?

Конечно, я могу передать обратный вызов, принадлежащий экземпляру приложения, экземпляру меню, который будет вызываться при выборе элемента. Но я немного не хочу этого делать, потому что событие "selection" - это просто "сторона рендеринга" компонента меню, поэтому я бы предпочел, чтобы это событие не попало в мой Menu API, но вместо этого оставаться внутри функции / метода рендеринга.

Итак, я хотел бы иметь дело с событиями на "стороне рендеринга". Но я думаю, это означает, что я должен отправить CustomEvent от Menuрендер функции и зарегистрировать CustomEvent обработчик внутри ApplicationФункция рендера, верно? Поддерживается ли этот вариант использования в макете? Есть ли другие альтернативы CustomEvent для моего варианта использования?

Спасибо!

PS: вопрос размещен здесь с билета № 71, чтобы получить больше ответов.

Answer 1

Обычно мы передаем обратные вызовы компонентам, которые вызываются при щелчке элементов. Меню может быть построено с обратным вызовом menuItemClicked(menuItem: MenuItem) например. Имхо это не пропускает никаких специфических для приложения знаний в меню / пункт меню. Создатель меню может сделать что-нибудь внутри обратного вызова, например, маршрутизацию или изменение переменной.

Система событий также, безусловно, возможна. Я не рекомендую использовать иерархию DOM для всплытия событий. Я могу представить Application создание меню с использованием menu = createMenu(...) и после звонка menu.addEventListener('itemClicked', navigate) или что-то.