3

私は新しいExtJSユーザーであり、質問があります。

車のある店があり、ブランドやモデルごとにすべての車を表示するボタン付きのメニューを作成しています。
次に、特定のブランド/モデルのすべての車を含むグリッドパネルのあるウィンドウを表示したいと思います。実際、ボタンを作成するときは次のようにします。

var aCarButton = Ext.create('Ext.Button', {
    text: aTextButton,
    handler: function() {
        var aResultWindow = new ResultWindow(aTextButton, myCarStore, 'Brand', aBrandValue);
        aResultWindow.create();
    }
});
aMenuPanel.add(aCarButton);

私の機能のために私はそれをします:

function ResultWindow(aTitle, aStore, aFilter, aFilterValue) {
    this.myTitle = aTitle;
    this.myStore = aStore;
    this.myFilter = aFilter;
    this.myFilterValue = aFilterValue;
    this.myStore.filter(aFilter, aFilterValue); 
}

ResultWindow.prototype.create = function() {
    var grid = Ext.create('Ext.grid.Panel', {
        store: this.myStore,
        columns: [
            ...
        ]
    });
    var window = Ext.create('Ext.window.Window', {
        layout: 'fit',
        maximizable: true,
        title: this.myTitle,
        items: [ grid ],
        width: 1024,
        height: 768
    });
    window.show();
}

まず、それが私が欲しいものを表示するための最良の方法であるかどうかはわかりません。
次に、すべての車(フィルターなし)を表示するボタンがありますが、12000年のすべてのレコードを表示するには約2分かかります。

だから私の最初の質問は、私が欲しいものを表示するための私の解決策が正しいかどうかを知ることです?
そして、私の2番目の質問は、すべての車をより速く表示できるかどうかです。

PS:エラーが発生した場合は、英語で申し訳ありません。

4

1 に答える 1

3

それは確かにそれを行う方法ですが、私はそれがExtでそれを行うための最良の方法ではないと思います、私はこれらの行の中で何かをします:

var aCarButton = Ext.create('Ext.Button', {
text: aTextButton,
handler: function() {
        myCarStore.filter('Brand', aBrandvalue);
        var win = Ext.create("Ext.window.Window", {
            title: aTextButton,
            layout: 'fit',
            maximizable: true,
            width: 1024,
            height: 768,
            items:[{
                xtype: 'grid',
                store: myCarStore,
                columns: [
                    ...
                ]
            }]
        });
        win.show();
});
aMenuPanel.add(aCarButton);

例のためだけにウィンドウをインラインで宣言しています。おそらく、グリッドが含まれているカスタムウィンドウと、グリッドでフィルタリングするためのいくつかのカスタム関数を使用しますが、要点:混乱する必要はありません。ここでのプロトタイプは、実際には必要ありません。必要なのがウィンドウの作成方法を制御することだけである場合は、次defineのようになります。

Ext.define("CarsWindow", {
    extend: 'Ext.window.Window',
    items:[
        ...
    ],
    filterByBrand: function(brandValue){
        this.down('grid').getStore().filter('Brand', brandValue);
    },
    ...
});

そして、次の方法でインスタンス化できます。

Ext.create("CarsWindow", { title: 'YourTitle', ...}).show();

2番目の質問では、パフォーマンスをあまり損なうことなくExtで大きなデータセットを表示する方法がありbuffered: trueます。ストア定義を設定してから、これについてさらに「store.loadPage(1)」を呼び出すことができます:store.buffered

お役に立てば幸いです。

于 2012-12-13T13:33:53.777 に答える