extjs - 覆盖 Extjs 类并调用 callParent

Question

我有几个月的 Extjs Web 应用程序开发经验。我遇到了这个问题:

当我覆盖一个类时，我修改了该方法并遵循了之前的实现并调用了 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()新布局器的名称称为旧布局器。我需要调用父类，而不是重写的方法。

知道如何解决这个问题吗？

Answer 1

如果您使用的是 ExtJS 4.1.3 或更高版本，您可以使用 this.callSuper(arguments) “跳过”重写的方法并调用父类(super class)实现。

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();
    }
});

和评论:

The patch method cannot use callParent to call the superclass method since that would call the overridden method containing the bug. In other words, the above patch would only produce "Fixed" then "Good" in the console log, whereas, using callParent would produce "Fixed" then "Bad" then "Good"