Sen*_*Zhe 16 overriding extjs extjs4
我有几个月的开发Extjs Web应用程序的经验.我遇到了这个问题:
当我覆盖一个类时,我修改了方法并按照前面的实现进行了调用callParent().重写部分可以工作但callParent()调用旧的实现.
我的首要代码
Ext.override(Ext.layout.component.Draw, {
finishedLayout: function (ownerContext) {
console.log("new layouter being overriden");
this.callParent(arguments);
}
});
Run Code Online (Sandbox Code Playgroud)
要重写的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);
}
Run Code Online (Sandbox Code Playgroud)
在控制台中,我可以看到第一个新的layouter打印出消息,然后是旧的layouter实现...我放了一个断点并回溯调用堆栈,callParent()新的layouter称为旧的.我需要调用父类,而不是重写方法.
知道如何解决这个问题吗?
hop*_*per 20
如果您使用的是ExtJS 4.1.3或更高版本,则可以使用this.callSuper(arguments)"跳过"重写的方法并调用超类实现.
该方法的ExtJS 文档提供了此示例:
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();
}
});
Run Code Online (Sandbox Code Playgroud)
和评论:
patch方法不能使用callParent来调用超类方法,因为这会调用包含bug的重写方法.换句话说,上面的补丁只会在控制台日志中产生"固定"然后"好",而使用callParent将产生"固定"然后"坏"然后"好"
您不能使用,callParent但您可以直接调用祖父类方法。
GrandparentClass.prototype.finishedLayout.apply(this, arguments);
Run Code Online (Sandbox Code Playgroud)
这是一种更通用(如果有些脆弱)的方法。
this.superclass.superclass[arguments.callee.$name].apply(this, arguments);
Run Code Online (Sandbox Code Playgroud)