Пытаюсь перенести понимание MVC и прочих шаблонов проектирования из PHP в JavaScript
И так, мне нужно в View создать элементы и назначить им обработчики, обрабатывать будет Controller, НО
Все 3 компонента (Model, View, Controller) должны быть полностью изолированы и ничего не знать друг о друге, как тогда назначать обработчик?
Варианты:
- Передать в View контекст (ссылку) на Controller
- Из Controller передать ссылки на функции в View
Подскажите пожалуйста, правильная ли схема?
1 вариантclass View{
// из контроллера передаю view.setContext(this)
setContext(context){
this._controller = context;
}
render(){
const btn = document.createElement('button');
btn.textContent('CLICK ME');
btn.addEventListener('click', () => this._controller.increaseCounter() );
}
// ...
}
2 вариант// в контроллере/клиентском коде передать в View.increaseFunction функцию Controller.increaseFunction
class View{
// ...
render(){
const btn = document.createElement('button');
btn.textContent('CLICK ME');
btn.addEventListener('click', this.increaseFunction );
}
// ...
}
НО этот вариант мне кажется жуть каким костыльным
Еще, я понимаю что все части должны быть изолированы, НО все же, не лучше ли
в контроллере получить данные из модели, и уже передать их на рендеринг в View, как это делается в каком-нибудь Laravel / Yii
Где могу найти адекватные примеры шаблонов на js ?