我有一个关于ExtJS中的多重继承的问题。虽然我知道我可以简单地复制代码以使其实现,但是我想知道是否有任何方法可以更有效地对其进行编码。

我的框架中有一个自定义的GridPanel组件,称为Kore.ux.grid.GridPanel。它扩展了Ext.GridPanel并具有其他常用功能,并提供了REST操作的接口(interface)。

不久之后,我的同事希望EditorGridPanel也以相同的方式实现,即她希望它是可编辑的,并且同时具有轻松执行REST操作的能力。

我的问题是,有什么方法可以扩展Ext.EditorGridPanel来使用自定义的Kore.ux.grid.GridPanel功能吗?

抱歉,没有任何语法错误,如果它令人困惑,我可以改写一下。谢谢!!

编辑

我再次谷歌搜索,发现线程说这是不可能的。如果遇到此问题,是否应该遵循更好的编码模式?

谢谢!

再次编辑

很抱歉,我找到了适合我的结构。.这是我发现对我有用的方法:

var Common = function(){}   //abstract class
Ext.apply(Common.prototype, {

    a : function(){},
    b: function(){}...

});

Ext.ux.SomePanelA = Ext.extend ( Ext.Panel, {

    stuff : ............

});

Ext.ux.SomePanelB = Ext.extend ( Ext.Panel, {

    diffStuff : ............

});

Ext.applyIf(Ext.ux.SomePanelA.prototype, Common.prototype);
Ext.apply(Ext.ux.SomePanelB.prototype, Common.prototype);

代码源:http://www.sencha.com/forum/showthread.php?48000-multiple-inheritance&p=228271&viewfull=1#post228271

如果您认为自己有更好的解决方案,请再次提供有用的建议:)谢谢!

最佳答案

您真正需要研究的是ExtJS插件。

/**
 * Boilerplate code taken from 'ExtJS in Action' by Jay Garcia
 */
YourNameSpace.RestGridPlugin = Ext.extend(Object, {
  constructor : function(config) {
    config = config || {};
    Ext.apply(this.config);
  },

  init : function(parent) { //parent argument here, is whatever you apply your plugin to
    parent.on('destroy', this.onDestroy, this);
    Ext.apply(parent, this.parentOverrides);
  },

  onDestroy : function() {
    //here you need to free any resources created by this plugin
  },

  parentOverrides : {
    //here you do your magic (add functionality to GridPanel)
  }

});

Ext.preg('restgridplugin',YourNameSpace.RestGridPlugin); //register your brand ne plugin

用法
someGrid = {
  xtype: 'grid',
  columns: ...
  store: ...
  plugins: [
    'restgridplugin'
  ]
}

someEditorGrid = {
  xtype: 'editorgrid',
  columns: ...
  store: ...
  plugins: [
    'restgridplugin'
  ]
}

10-06 02:07