web-dev-qa-db-ja.com

ExtjsクラスをオーバーライドしてcallParentを呼び出す

ExtjsWebアプリケーションの開発に数か月の経験があります。私はこの問題に遭遇しました:

クラスをオーバーライドするときは、メソッドを変更し、前の実装に従って、callParent()を呼び出しました。オーバーライド部分は機能しますが、callParent()は古い実装を呼び出しました。

私のオーバーライドコード

_Ext.override(Ext.layout.component.Draw, {
    finishedLayout: function (ownerContext) {

        console.log("new layouter being overriden");
        this.callParent(arguments);
    }
});
_

オーバーライドされるExtjsクラスメソッド:

_finishedLayout: function (ownerContext) {
    var props = ownerContext.props,
        paddingInfo = ownerContext.getPaddingInfo();

    console.log("old layouter being overriden");
    this.owner.setSurfaceSize(props.contentWidth - paddingInfo.width, props.contentHeight - paddingInfo.height);

    this.callParent(arguments);
}
_

コンソールでは、最初に新しいレイアーがメッセージを出力し、次に古いレイアーの実装が出力されることがわかります...ブレークポイントを設定し、呼び出しスタック、古いと呼ばれる新しいレイアーのcallParent()をトレースします。 1。親クラスを呼び出す必要がありますが、オーバーライドされたメソッドは呼び出さないでください。

この問題を解決する方法はありますか?

16
Seng Zhe

ExtJS 4.1.3以降を使用している場合は、this.callSuper(arguments)を使用して、オーバーライドされたメソッドを「スキップ」し、スーパークラスの実装を呼び出すことができます。

メソッドのExtJS documentation は、次の例を提供します。

Ext.define('Ext.some.Class', {
    method: function () {
        console.log('Good');
    }
});

Ext.define('Ext.some.DerivedClass', {
    method: function () {
        console.log('Bad');

        // ... logic but with a bug ...

        this.callParent();
    }
});

Ext.define('App.patches.DerivedClass', {
    override: 'Ext.some.DerivedClass',

    method: function () {
        console.log('Fixed');

        // ... logic but with bug fixed ...

        this.callSuper();
    }
});

そしてコメント:

パッチメソッドは、callParentを使用してスーパークラスメソッドを呼び出すことはできません。これは、バグを含むオーバーライドされたメソッドを呼び出すためです。つまり、上記のパッチはコンソールログに「Fixed」、「Good」の順に生成されるだけですが、callParentを使用すると、「Fixed」、「Bad」、「Good」の順に生成されます。

20
hopper

callParentを使用することはできませんが、代わりに祖父母クラスのメソッドを直接呼び出すことができます。

GrandparentClass.prototype.finishedLayout.apply(this, arguments);

これは、より一般的な(多少脆弱な場合)アプローチです。

this.superclass.superclass[arguments.callee.$name].apply(this, arguments);
4
wantok