ExtJS Application Event Woes

extjs4 extjs-mvc

Question

EXTJS 4.1

Me he encontrado con un acertijo y me encantaría escuchar la opinión de otros desarrolladores sobre este escenario con respecto a los eventos ExtJS y los métodos de control. Entiendo que este tema ha sido cubierto y debatido en numerosas ocasiones, pero creo que podría ser necesario profundizar un poco más.

Como es práctica habitual, defino oyentes de eventos en la declaración del método init() mi controlador de la siguiente manera:

Ext.define("My.controller.Awesome", {
init: function(application){
    /** Observe some Views */
    this.control({
        ''my-awesome-view #saveButton'':{
             click: this.saveMyData
         }
    });

    /** Listen for Events, too! */
    this.on({
        showAwesomeView: this.showMyAwesomeView
    });

    /** Application events, what fun! */
    this.application.on({
        showThatAwesomeView: this.showMyAwesomeView
    });
}

Ahora, mientras me dedico alegremente a la codificación de algunas funciones en otro controlador, me resulta necesario llamar a showMyAwesomeView en My.controller.Awesome . Puedo hacer esto de diferentes formas ...

Ext.define("My.controller.Other", {

    /* ... class definition */

    someImportant: function(){

        // I can do this (Approach #1)
        this.application.getController("Awesome").showMyAwesomeView();

        // Or I can do this (Approach #2)
        this.application.getController("Awesome").fireEvent("showAwesomeView");

        // Last but not least, I can do this (Approach #3)
        this.application.fireEvent("showThatAwesomeView");
    }
});

Para mí, el Enfoque n. ° 3 se siente más "correcto". Mi problema es que si no he instanciado My.controller.Awesome antes, el método init() aún no se ha ejecutado y, por lo tanto, no hay oyentes establecidos, por lo que el evento disparado se va a tierra misteriosa del que nunca se ha oído hablar de nuevo.

He sobrecargado Ext.application.getController() para llamar a controller.init() antes de devolver el controller , por lo tanto, un controlador tiene su método init llamado tan pronto como se carga (normalmente como una dependencia en otro controlador). ¿Es esto malo?

Para ahorrar tiempo de carga (mi aplicación es bastante grande), mis controladores y sus dependencias se cargan según sea necesario. Por lo tanto, la mayoría de mis controladores (y vistas y almacenes de datos) no se instancian cuando mi aplicación se inicia por lo tanto, no init () ''ed, lo que hace que los eventos de descarga de toda la aplicación sean bastante engorrosos.

Siento que me puede estar perdiendo algo importante aquí, o tal vez solo tengo que morder la bala y asegurarme de que mis controladores hayan sido iniciados antes de disparar los eventos. Supongo que también podría poner un número absolutamente horroroso de oyentes de eventos en el archivo principal de la aplicación y manejar los controladores de inicio antes de llamar a sus métodos en consecuencia, pero esto parece muy descuidado y difícil de mantener.

Cualquier comentario sería muy apreciado, ¡gracias por su tiempo!

Answer 1

El enfoque n. ° 3 (this.application.fireEvent (''showThatAwesomeView'')) es una gran solución. El uso de eventos de aplicación da como resultado controladores que no tienen suposiciones sobre qué otra lógica se puede agregar o eliminar de la aplicación relacionada con este evento.

En cuanto a su preocupación acerca de que los controladores se hayan instanciado a tiempo para que estén correctamente vinculados a los eventos, el uso del controlador Ext.app.Application lo eliminará. El controlador de la aplicación inicializa todos los controladores especificados cuando la aplicación se inicializa. Notó una preocupación sobre el tiempo de inicio relacionado con la cantidad de controladores. He trabajado en muchas aplicaciones de una sola página que tienen docenas e incluso cientos de controladores en algunos casos. Mantener cualquier lógica de inicio al mínimo debería reducir cualquier desaceleración notable. Las secuencias de comandos combinadas y combinadas en lugar de la carga a pedido han funcionado bien para mantener el inicio de la aplicación muy rápido.

Evitar el método getController es una buena práctica. La lógica de la aplicación tiende a estar mejor organizada cuando se usan eventos de aplicación en lugar de la lógica que estrecha estrechamente los controladores entre sí.

Answer 2

Ext.define(''UD.controller.c1'', {
    extend: ''Ext.app.Controller'',
    refs: [
            {
                selector: ''viewport'',
                ref: ''userview''
            }
          ],
    init: function() {
        console.log("initincontroller!!");
        this.control({
            ''viewport > panel'': {
                render: this.onPanelRendered
            }
        });
    },
    onPanelRendered:function(){
        alert("rendered");
        UD.getApplication().fireEvent(''myevent'');
    }
});



Ext.define(''UD.controller.c2'', {
    extend: ''Ext.app.Controller'',
    refs: [
            {
                selector: ''viewport'',
                ref: ''userview''
            }
          ],
    init: function() {
        console.log("initincontroller!!");
            UD.getApplication().on({
                myevent : this.doSomething
             });
    },
    doSomething:function(){
        alert("controller2");
    }
});