2013-04-09 26 views
11

我的經驗ExtJS的開發Web應用程序幾個月。我就遇到了這個問題:重寫ExtJS的類和調用callParent

當我重寫一個類,我修改的方法和遵循以前的實現和調用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()叫老之一。我需要調用父類,但不是重寫的方法。

任何想法如何解決這個問題?

+0

對不起,我使用的是,我正在使用ExtJs 4.1.2。選擇的答案是正確的方法,但我無法使用它,而是使用@wantok提供的答案。 – 2013-04-10 01:56:42

+0

順便說一句,繞過您的超級計算機之一,是一個很大的黑客,明智和謹慎使用! – 2013-09-20 18:27:02

回答

18

如果您正在使用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.paches.DerivedClass', { 
    override: 'Ext.some.DerivedClass', 

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

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

     this.callSuper(); 
    } 
}); 

與評論:

補丁方法不能使用callParent來調用父類的方法,因爲這將要求包含重寫的方法錯誤。換句話說,上面的補丁只會在控制檯日誌中產生「固定」,然後是「良好」,而使用callParent會產生「固定」,然後「壞」,然後「好」

3

不能使用callParent但你可以調用祖父母類的方法,而不是直接。

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

這裏有一個更通用的(如果有些脆弱)的方法。

this.superclass.superclass[arguments.callee.$name].apply(this, arguments); 
+0

我認爲這是更清晰的,因爲它表明你的意圖。特別是因爲跳過重寫的方法看起來像一個黑客 – 2013-09-20 18:25:48