How correctly to assign event handlers in MVC?

Try to transfer understanding of MVC and other design patterns in JavaScript from PHP

And so, I need a View to create elements and assign them to handlers that will handle the Controller, BUT

All 3 components (Model, View, Controller) should be completely isolated and know nothing about each other, how then to assign a handler?

Options:
  1. Pass in View the context (link) to Controller
  2. From the Controller to pass references to functions in the View


Please tell me the correct diagram?

Option 1
class View{
 // from the controller pass the view.setContext(this)
setContext(context){
 this._controller = context;
}

render(){
 const btn = document.createElement('button');
 btn.textContent('CLICK ME');
 btn.addEventListener('click', () => this._controller.increaseCounter() ); 
}
// ...
 }
Option 2
// in controller/client code to pass in View.increaseFunction function Controller.increaseFunction

 class View{
 // ...

render(){
 const btn = document.createElement('button');
 btn.textContent('CLICK ME');
 btn.addEventListener('click', this.increaseFunction ); 
}
// ...
 }

BUT this option seems the horror which spike


Still, I understand that all parts must be isolated, BUT still, isn't it better in the controller to get data from the model and pass them to the rendering View, as is any Laravel / Yii

Where can I find adequate examples of templates in js ?
April 7th 20 at 15:26
1 answer
April 7th 20 at 15:28
To begin with, what is web server application and the client - they work in different environments and facing different challenges.
Server - one point of entry, as a rule, the query text - the text value, the full management of this point is the controller. The controller resolves flown the request and either invokes the child controllers or just picks out the data using the models and gives them in view.
The client application has a BUNCH of entry points - any supplied event handler. Ie first if you love and respect so MVC will have to collect all the handlers together and to give some kind of controller router. Ie, instead of clicking on the item Topinka to start the animation with jQuery, you have to code in click event, to give it to the controller and expect out of callback same you, since no one will be able to pull the animations except you... This colback will modestly be called a render... :) Not, of course, in this approach, there are also plenty delicious Fenech, but imho, the MVC for the client application is a tribute to fashion and clean raspaltsovka...
@darian.Tillman, I don't need MVC for the whole application, but only for the component.

To share in the responsibility of the rendering / event handling / model - torey_Zie commented on April 7th 20 at 15:31

Find more questions by tags JavaScript