日々精進

新しく学んだことを書き留めていきます

Extjs Miscellaneous FAQその1

この記事はMiscellaneous FAQ | Learn | Senchaの抄訳・意訳です。


Find a Plugin by id
getPluginメソッドコンポーネントクラスに追加するコードは以下。
(訳注:フレームワークのクラスにメソッドを追加するのは言語の組み込みクラスにメソッドを追加するのと同様にアンチパターンでは?
リンク先の記事のコードが間違ってたっぽいので修正しました。
Extjs4ではextendメソッドは非推奨っぽいのでimplementメソッドに直しました。)

Ext.Component.implement({
    getPlugin: function(pluginId) {
        if (Ext.isArray(this.plugins)) {
            for (var i = 0, len = this.plugins.length; i < len; i++) {
                if (this.plugins[i].pluginId === pluginId) {
                    return this.plugins[i];
                }
            }
            return false;
        } else {
            return this.plugins.pluginId === pluginId ? this.plugins : false;
        }
    }	
});



Automatically reload store
指定時間おきにPollingしてStoreを更新する方法。
やりかたその1
(訳注:各Store毎にリロードさせる方法。Storeの数が少ない場合はこっちでいいかも。
わかりやすいようにコードを一部修正しました。)

dataStore = new ...
 
var t = setInterval('refresh()',50000);
 
function refresh{
   dataStore.reload();
}



やりかたその2
(訳注:Storeに自動リフレッシュメソッドを追加する方法。Storeが多い場合はこちらの方がいいかも。
でもこのコードでは二回目以降のロード時にコールバック関数が実行されないよね・・・?リロード時もコールバック関数を実行させたい場合は適宜修正して下さい。)

Ext.data.Store.implement({
    //    startAutoRefresh : function(interval, params, callback, refreshNow){
    startAutoRefresh: function(c){
        if (c.refreshNow) {
            this.load({
                params: c.params,
                callback: c.callback
            });
        }
        if (this.autoRefreshProcId) {
            clearInterval(this.autoRefreshProcId);
        }
        //二回目以降のロードにreloadメソッドを使う。
        //reloadメソッドには引数を渡さない
        this.autoRefreshProcId = setInterval(
            this.reload.createDelegate(this, []), c.interval * 1000);
    },
    stopAutoRefresh: function(){
        if (this.autoRefreshProcId) {
            clearInterval(this.autoRefreshProcId);
        }
    }
});
 
//最初のロード
store.load({
    params: {
        start: 0, 
        limit: 10
    },
    scope: this,
    callback: function(rec, options, success){
        console.info(arguments);
    }
}); 
 
//リフレッシュの設定
store.startAutoRefresh({
    refreshNow: true,
    interval: 20, //refresh rate in seconds
    params: { 
        start: 0, 
        limit: 10
    },
    scope: this,
    callback: function(rec, options, success){
        console.info(arguments);
    }
});