0

Ext.panel.Panelを拡張するクラスがあります。

簡略化されたコード：

Ext.define("some.namespace.MyOwnPanel", { 
    extends: "Ext.panel.Panel",

    constructor: function (config) {
        var me = this;

        Ext.apply(this, config);
        this.callParent(arguments);

        this.layout = "border";

        this.centerPanel = Ext.create("Ext.panel.Panel" , {
            region: "center",
            layout: "fit",
            border: false
        });

        this.westPanel = Ext.create("Ext.panel.Panel", {
            region: "west",
            layout: "fit",
            border: false
        });

        this.add(this.centerPanel);
        this.add(this.westPanel);

        this.on("afterrender", function () {
            // create grid for center panel. Data is loaded with AJAX in that function and the component is also added to this.centerPanel
            me.createGrid();
        });
    }
}

動作してアフターレンダーイベントが発生することもありますが、動作せずにWebアプリケーションがクラッシュすることもあります。エラーは発生しませんが、extコンポーネントの作成はその時点を超えて停止します。

私は多くのことを試みました。ほとんどが同僚によって書かれた元のコードには、4.1と互換性のあるExtjs3.1コードの痕跡が多く含まれています。適切な4.1コードに書き直そうとしましたが、成功しませんでした。コードをinitComponentメソッドに移動しようとしましたが、失敗しました。

これを修正する方法については、これ以上のアイデアはありません。誰かが以前にそのようなことに遭遇したことがありますか、そしてあなたは何をしましたか？教えてください！

4

2 に答える 2

1

this.centerPanel = Ext.create（ "Ext.panel.Panel"、{... in initComponent（）関数を作成する必要があると思います：

initComponent: function() {
    Ext.apply(this, {
        centerPanel: Ext.create("Ext.panel.Panel" , { ... },
        ...
    });
    this.callParent(arguments);
}

コンストラクターにはありません。

于 2013-01-25T19:58:27.027 に答える
1

constructorこの問題は、 ではなくでクラスを設定することに関係していinitComponentます。 initComponentクラスをセットアップする推奨される方法であり、コンストラクターは特別な場合にのみオーバーライドする必要があります。クラスが構成で作成されている場合、クラスが設定されている方法では、afterrenderイベントが発生しない場合がありますrenderTo。 

Ext.define('Bad', {
    extend: 'Ext.Component',
    constructor: function() {
        //the parent constructor is called here and if renderTo 
        // is defined it will render before the afterrender listener is added
        this.callParent(arguments);
        this.on('afterrender', function(){
            window.alert('rendered')
        })
    }
})

var works = new Bad();
//this will alert rendered
works.render(document.body)

//this wont
new Bad({renderTo: document.body})

Ext.define('Good', {
    extend: 'Ext.Component',
    //change constructor to initComponent
    initComponent: function() {
        this.callParent(arguments);
        this.on('afterrender', function(){
            window.alert('rendered')
        })
    }
})

//alerts 
new Good({renderTo: document.body})
于 2013-01-25T22:09:44.450 に答える