7

EXTJS 4.1

私はちょっとした難問にぶつかりました。ExtJS イベントとコントローラー メソッドに関するこのシナリオについて、他の開発者の意見を聞きたいと思っています。このトピックが何度も取り上げられ、議論されてきたことは理解していますが、もう少し掘り下げる必要があると思います。

init()標準的な方法として、コントローラーのメソッド宣言でイベン​​ト リスナーを次のように定義します。

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
    });
}

さて、他のコントローラーでいくつかの機能を楽しくコーディングしているときに、 を呼び出す必要があることに気付きshowMyAwesomeViewましたMy.controller.Awesome。私はこれをいくつかの異なる方法で行うことができます...

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");
    }
});

私には、アプローチ #3が最も「正しい」と感じています。私の問題は、My.controller.Awesome以前にインスタンス化していない場合、init()メソッドがまだ実行されていないため、リスナーが確立されていないため、発生したイベントが謎の土地に消えてしまい、二度と聞かれないことです。

を返す前Ext.application.getController()に呼び出すためにオーバーロードしたため、コントローラーは、ロードされるとすぐにメソッドが呼び出されます (通常、別のコントローラーの依存関係として)。これは悪いですか？controller.init()controllerinit

読み込み時間を節約するために (私のアプリケーションは非常に大きいため)、コントローラーとその依存関係は必要に応じて読み込まれます。したがって、アプリケーションの最初の起動時にコントローラー (およびビュー、データストア) の大部分がインスタンス化されないため、init()が実行されないため、アプリケーション全体のイベントの発生が非常に面倒になります。

ここで大きな何かが欠けているように感じます。または、イベントを発生させる前に、弾丸を噛んでコントローラーが初期化されていることを確認する必要があるだけかもしれません。メイン アプリケーション ファイルに非常に恐ろしい数のイベント リスナーを配置し、それに応じてメソッドを呼び出す前にコントローラーの初期化を処理することもできると思いますが、これは非常にずさんで保守が難しいようです。

ご意見をお待ちしております。お時間をいただきありがとうございます。

4

2 に答える 2

3

Approach #3 (this.application.fireEvent('showThatAwesomeView')) is a great solution. The use of application events results in controllers that have no assumptions about what other logic may be added or removed from the application related to this event.

Regarding your concern about controllers having been instantiated in time to be correctly bound to events, use of the Ext.app.Application controller will eliminate this. The App controller initializes all specified controllers when the App initializes. You noted a concern about start-up time related to the number of controllers. I have worked on many single page apps that have dozens and even hundreds of controllers in some cases. Keeping any init logic to a minimum should reduce any noticeable slowdown. Minified and combined scripts in place of on-demand loading has worked well to keep app start-up very fast.

Avoiding the getController method is good practice. Application logic tends to be better organized when using application events in place of logic that tightly couples controllers with each other.

于 2013-05-13T18:21:29.917 に答える
0 
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");
    }
});
于 2014-01-30T13:18:22.650 に答える