2

Sencha touch 2.1 アプリケーションをビルドしています。

私のアプリケーションには、コントローラ クラスの参照を保持する 1 つのグローバル変数があります。この参照は、ストアの 1 つのロード時にコントローラー関数を実行するために使用されますが、これを低速のリモート サーバーにデプロイし、このグローバル変数がコントローラー オブジェクトの参照を取得する前にストアのロードが開始されると、問題が発生します。ストアのロード前にこの参照を提供するために、コントローラーのinitメソッドに初期化ロジックを入れてみました

init : function(){
    bossController = this.getApplication().getController('Boss');
},

コントローラーの init メソッドでは、この init が呼び出される前にビューとストアが読み込まれるため、次のエラーが発生します。

Cannot call method 'loadMagazines' of undefined

これは、ストア内の私のオンロード リスナーです。

listeners:{
        load: function( me, records, successful, operation, eOpts ){ 
            bossController.loadMagazines(this, records);
        }
}

コントローラーの init メソッドの代わりに app.js launch() メソッドでこの変数を初期化しようとしましたが、それも機能しませんでした。

コードをローカルのApacheに配置し、Chromeブラウザーを使用してアクセスすると、両方のアプローチが正常に機能しますが、低速のリモートサーバーに配置すると機能しないことに注意してください。

編集

これがアプリケーション フローの仕組みです。0. すべてのモデル、ビュー、ストア、およびコントローラーは app.js で定義されます。

  1. app.js の Launch 関数は、ビューポートにメイン ビューを追加します。

  2. メイン ビューはマガジン ビューを作成し、それを自身に追加します。

  3. マガジンビューの初期化メソッドで、ストアをクレートしてロードします。

  4. ストアのロードリスナーではコントローラーを使用しています。

これは私の見解です：

Ext.define('myshop.view.MagazinePanel', {
extend : 'Ext.Panel',
requires : [ 
    'myshop.model.MagazinePage',
    'myshop.store.MagazineStore',
    'Ext.XTemplate',
    'Ext.data.Store'
],
alias : 'widget.magazinepanelview',
xtype : 'magazinepanelview',
config : {
    layout : 'hbox',
    id : 'hc',
    scrollable: 'horizontal',
    directionLock : true,
    masked: {
        xtype: 'loadmask',
        message: 'Loading'
    },
inline: {
        wrap: false
    },
    items : [{
        xtype : 'panel',
        html : ''
    }]
},
initialize: function() {
    var me = this;
    var myStore = Ext.create('myshop.store.MagazineStore');
        myStore.load({
            callback: function(records, operation, success) {
                me.setMasked(false);
            },
            scope: this
        });
    this.callParent();
}
});

そしてこれが店です：

Ext.define('myshop.store.MagazineStore',{
extend:'Ext.data.Store',
requires: [
           'myshop.model.MagazinePage',
           'Ext.data.proxy.JsonP'
       ],
config:{
    storeId : 'ms',
    model:'myshop.model.MagazinePage',
    autoLoad :false,
    pageSize: 30,
    proxy : {
        type: 'jsonp',
        url: Properties.PORTAL_SERVICE_BASE_URL+'test/categories/list',
        callbackKey: 'callback',
        startParam: false, //to remove param "start" and making it constant
        extraParams: {
            start : 0,
            _type : 'json'
        },
        reader: {
            type: 'json',
            rootProperty: 'categories.data',
            totalProperty: 'categories.status.totalCount'
        }
    },
    listeners:{
        load: function( me, records, successful, operation, eOpts ){ 
            bossController.loadMagazines(this, records);
        }
    }
}
});
4

4 に答える 4

1

サンプルコードにはいくつかの部分が欠けているため、ヒント/推測にすぎません。autoLoadあなたのストアにはtrueのプロパティがあり、初期化されるとすぐにロードされると思います。それをオフにして、このようなことを試してください。

init : function(){
    bossController = this.getApplication().getController('Boss'); // bossController where is this var defined? 
    // fire a ready event
    // or
    Ext.StoreMgr.lookup('YourStoreName').load();
}

または、ストア、ロードする人、ロードされる時期、およびスコープに関する詳細情報を提供します。

于 2012-12-20T12:47:01.100 に答える
0

データのロードはコントローラを実行する必要がありますが、ビューは実行できません。

   Ext.define("myshop.controller.Boss", {
    extend: 'Ext.app.Controller',

    config: {
        refs: {
            magazinePanel: '#hc'
        },
        control: {
            magazinePanel: {
                initialize: 'initializeMagazinePanel'
            }
        }
    },

    initializeMagazinePanel: function() {
        var me = this;
        var myStore = Ext.create('myshop.store.MagazineStore', {
            listeners:{
                scope: this,
                load: this.onMagazineStoreLoad
            }
        });
        myStore.load();
    },

    onMagazineStoreLoad: function(me, records, successful, operation, eOpts) {
        this.getMagazinePanel().setMasked(false);
        this.loadMagazines(records)
    },

    loadMagazines: function(records) {
    }
});
于 2012-12-21T11:21:24.800 に答える
0

@sra が提案するように、loadMagazines 関数をコントローラーの明示的な load() 関数の成功コールバックに配置し、autoLoad を無効にすることはできませんか?

何かのようなもの：

//in controller
init: function() {
    myStore.load({
        callback: function(recs, op, success) {
            // do the load magazines thing
        }
    })
}
于 2012-12-20T13:04:16.023 に答える