initComponent
関数の使用方法がextjs4.1に何であるか教えてもらえますか?例にこの方法は、コンポーネントのconstructor
に似ているextjs4.1でinitComponent関数を使用するのは何ですか?
おかげ
initComponent
関数の使用方法がextjs4.1に何であるか教えてもらえますか?例にこの方法は、コンポーネントのconstructor
に似ているextjs4.1でinitComponent関数を使用するのは何ですか?
おかげ
を提供してください。それは本当にconstructor
によって呼び出され、コンポーネントの初期化をカスタマイズするための本当に良いフックポイントです(名前のとおり!)。
非常にまれな場合を除き、constructor
の代わりにinitComponent
をオーバーライドする必要があります。これは、より基本的な初期化が既に行われているためです。特に、コンストラクタに渡されるconfigオブジェクトは、すでにオブジェクトにマージされています。
コンポーネントの設定をカスタマイズする場合は、width
のように設定します。コンストラクタでそれを実行しようとすると、最初にconfigオブジェクトを渡したかどうかをチェックしなければなりません(undefined
にプロパティを設定しようとするのを避けるため)、configオブジェクトをオーバーライドしますそれは悪い習慣です。 this
にオプションを設定すると、その設定オブジェクトによってオーバーライドされる可能性があります。設定オブジェクトの値を変更した場合は、オブジェクトを変更して呼び出しコードから期待値を外します(つまり、設定オブジェクトを再利用すると予期せぬ結果になる)。 initComponent
では、値は常にthis.width
になるため、設定について心配する必要はありません。
さらに興味深い点は、initComponent
は、子コンポーネント(コンテナ用)、ストア、ビュー、テンプレートなどが作成される場所です。したがって、スーパークラスinitComponent
メソッドを呼び出す前に、まだ使用されていないか、必要でないことを確認することができます(アイテムの追加、店舗の作成など)。一方、スーパーメソッドを呼び出すと、すべての依存関係が作成され、インスタンス化されていることが保証されます。したがって、リスナーを依存関係に追加するのに適しています。
と言われていますが、initComponent
にはレンダリングが行われていません。子コンポーネントは作成され、構成されますが、DOM要素は作成されていません。レンダリングに影響を与えるために、あなたは、レンダリング関連イベントを使用するか、またはafterRender
onRender
方法を探して...
する必要がありますここで示す要約です:
constructor: function(config) {
// --- Accessing a config option is very complicated ---
// unsafe: this may be changed by the passed config
if (this.enableSomeFeature) { ... }
// instead, you would have to do:
var featureEnabled;
if (config) { // not sure we've been passed a config object
if (Ext.isDefined(config.featureEnabled)) {
featureEnabled = config.featureEnabled;
} else {
featureEnabled = this.enableSomeFeature;
}
} else {
featureEnabled = this.enableSomeFeature;
}
// now we know, but that wasn't smooth
if (featureEnabled) {
...
}
// --- Even worse: trying to change the value of the option ---
// unsafe: we may not have a config object
config.enableSomeFeature = false;
// unsafe: we are modifying the original config object
(config = config || {}).enableSomeFeature = false;
// cloning the config object is safe, but that's ineficient
// and inelegant
config = Ext.apply({enableSomeFeature: false}, config);
// --- Super method ---
this.callParent(arguments); // don't forget the arguments here!
// --------------------
// here initComponent will have been called
}
,initComponent: function() {
// --- Accessing config options is easy ---
// reading
if (this.enableSomeFeature) { ... }
// or writing: we now we change it in the right place, and
// we know it has not been used yet
this.deferRender = true;
// --- Completing or changing dependant objects is safe ---
// items, stores, templates, etc.
// Safe:
// 1. you can be sure that the store has not already been used
// 2. you can be sure that the config object will be instantiated
// in the super method
this.store = {
type: 'json'
...
};
// --- However that's too early to use dependant objects ---
// Unsafe: you've no certitude that the template object has
// already been created
this.tpl.compile();
// --- Super method ---
this.callParent();
// --------------------
// Safe: the store has been instantiated here
this.getStore().on({
...
});
// will crash, the element has not been created yet
this.el.getWidth();
}
は、