Ext JS 4.0.7 で、クラスを作る場合…
2012年1月13日修正:
やっぱりクラス作成について、まだまだだったっぽいので修正をします。
修正箇所:
コンストラクタで「me.callParent(arguments);」を呼び出しているが、
足りなかった…
me.callParent(arguments);
me.initConfig(config); // これを追加
する必要がある。
なぜなら、config のgetter/setter は、initConfig()を呼び出す事により作成される。
そのため、上記2点の呼び出しは必須でしょう。
下記のソースにも追加しておきました。
2012年1月11日投稿:
****************修正前********************
Ext JS 4.0系 で、クラスを作成する(Ext.defineを使う)場合、
"extend:"の指定ができます。
指定しない場合は、「Ext.Base」が自動で付与されます。(確か…)
で、使ってて解った事は…
「Ext.Component」は必ず継承すべきなんだろうなぁ…
という事です。
なぜなら、
1.「Ext.Component」を継承しておけば、コンストラクタにconfig形式で値が設定できるので、
Extの使い方と同じにできる。
(config を必ず指定しなきゃだめだけど…)
2.イベントの登録ができる。
の2点です。
特に、「1.」は意外と良いです。ソース全体が統一されるので
個人的には大好きです♪
何も継承しなくても「Ext.Base」が付く(はず)なので、「Ext.Component」を継承しておくのが
無難だと思います。
以下例です。ただし、動かしてないので、動かなかったらごめんなさい。:
*************************クラス************************
Ext.define('hoge', {
extend: 'Ext.Component',
// 継承する場合、親クラスのconfig を必ず確認すること
config : {
/**
* @cfg {String} text
* ポップアップを表示する時のデータ(''の場合は、からのポップアップが出ます。)
*/
text : null
},
statics: {
SIZE : 6,
ERROR_COLOR : 'red',
DEFAULT_COLOR : 'black',
},
// コンストラクタ *************************************
/**
* コンストラクタ(configで設定してください)
* コンストラクタが無ければ、自動的に text にデータが設定されます。
*/
constructor : function(config) {
// ExtJsのフレームワークがこんなやり方なのでマネ
var me = this;
// スーパークラスを呼び出す(引数は同じものを渡す)
// コンストラクタを作った場合は、必ず呼ぶ必要があるみたい…
me.callParent(arguments);
me.initConfig(config); // これを追加
// 注意:"arguments" とは、引数の事である。JavaScript って怖いねぇ…
// もちろん、function(config) と書いて、me.callParent(config); にしても良い。
return me;
},
/*
* 何かメソッド
*/
aaa : function(){},
・
・
・
}
*************************呼び出し方法************************
Ext.onReady(function() {
var hoge = new hoge( { text : 'あいうえお' } );
console.log(hoge.getText()); // 「あいうえお」が出力
hoge.setText('かきくけこ');
console.warn(hoge.getText()); // 「かきくけこ」が出力
}
コメント
コメントを投稿