15

私は extjs が初めてで、MVC アーキテクチャを使用しています。

私のアプリケーションがコントローラーのメソッドを参照するとき、私はそのようにします ( でMyApp.Application):

Mb.app.getController('Main').myMethod();

長くなりましたが、これでいいと思います。

コントローラーがクロージャーで独自のメソッドを呼び出すとき、私はこのコードを使用するように導かれました (in MyApp.controller.Main:

controllerMethodOne: function(){
    Ext.Ajax.request({
        url: ...,
        params: ...,
        success: (function(response){
            list = Ext.JSON.decode(response.responseText);
            list.forEach(function(item){
                storeMenu.add(
                    Ext.create('Ext.menu.Item', {
                        text: item.text,
                        handler: function(el){MyApp.app.getController('Main').controllerMethodTwo()}
                    })
                )
            })
        })
    })
},

クロージャー内のコントローラーオブジェクトを参照していないMyApp.app.getController('Main').controllerMethodTwo()ため、メソッドを参照したため、機能していません。thisthis..controllerMethodTwo()

私はこれが非常に複雑であることに気づきました.誰かがそれを回避するためのアイデアを持っていることを願っています-回避MyApp.app.getController策.

アップデート

すべての提案のおかげで、コードを最適化して思いついたのは次のとおりです。

// in my controller
    mixins: ['Mb.controller.mixin.StoreMenu'],
    // I use that style of menus in two controllers thats why I use a mixin
    init: function() {
        this.control({
            '#vg_storeMenu menuitem': {
                click: this.onStoreMenuClicked
            }
        })
    },

// the controller mixin
Ext.define('Mb.controller.mixin.StoreMenu', {
    extend: 'Ext.app.Controller',
    buildStoreMenu: function(store_name){
        var storeMenu = Ext.ComponentQuery.query('#' + store_name + 'Menu')[0];
        Ext.Ajax.request({
            url: Paths.ajax + 'json.php',
            params: {list: store_name + 's'},
            success: (function(response){
            list = Ext.JSON.decode(response.responseText);
            items = Ext.Array.map(list, function(item) {
                return {
                    xtype: 'menuitem',
                    text: item.text
                }
            });
                storeMenu.add(items);
            })
        })
    },
    onStoreMenuClicked: function(el){
        ...
    }
});
4

2 に答える 2

2

thissuccess適切なスコープがないため、コールバックでは機能しません。あなたの2つのオプションは次のとおりです。

1: 関数の先頭に変数を作成して、コールバックで参照します。

controllerMethodOne: function(){
    var me = this;
    Ext.Ajax.request({
        url: ...,
        params: ...,
        success: (function(response){
            list = Ext.JSON.decode(response.responseText);
            list.forEach(function(item){
                storeMenu.add(
                    Ext.create('Ext.menu.Item', {
                        text: item.text,
                        handler: function(el){me.controllerMethodTwo()}
                    })
                )
            })
        })
    })
},

2:呼び出しscopeの構成を使用します。Ext.Ajax.request

controllerMethodOne: function(){
    Ext.Ajax.request({
        url: ...,
        params: ...,
        scope: this,
        success: (function(response){
            list = Ext.JSON.decode(response.responseText);
            list.forEach(function(item){
                storeMenu.add(
                    Ext.create('Ext.menu.Item', {
                        text: item.text,
                        handler: function(el){me.controllerMethodTwo()}
                    })
                )
            })
        })
    })
},
于 2013-10-08T17:12:29.060 に答える