0

我有以下两个扩展 ExtJs Grid 面板的类：

  1. ReadonlyDataGrid - 顾名思义，基本的不可编辑的 ExtJs 网格
  2. EditableDataGrid - 带有单元格和行编辑插件的 ExtJs 网格

现在我想提供一个新类，它将基于开发人员在网格 JSON 配置中设置的属性扩展上述 2 个类之一

例如：

爪哇：

parentObj.put("gridType", "readonly");

JS：

Ext.define('Grid.view.GridFactory', {
extend: 'Grid.view.AbstractGridFactory',
alias: 'widget.gridfactory',
singleton: true,
create : function(model){
    var grid;
    switch(model.input.gridType)
    {
        case 'readonly':
            grid = new Grid class extending the ReadonlyDataGrid class;
            break;
        case 'editable':
            grid = new Grid class extending the EditableDataGrid class;
            break;          
    }

    return grid;
  }
});

现在我必须创建两个单独的类文件来处理这个。

第一类：

Ext.define('Grid.view.EditableGrid',{
extend : 'Grid.view.EditableDataGrid',
.... //additional features
});

第 2 类：

Ext.define('Grid.view.ReadonlyGrid',{
extend : 'Grid.view.ReadOnlyDataGrid',
.... //additional features
});
  1. 如何将这 2 个类合并为 1 个？
  2. 如上所示，如何根据用户配置更改扩展属性或扩展正确的类？
  3. 设计明智什么是更好的？拥有 1 个类并在运行时更改超类或维护 2 个类但使用冗余/相同代码？
4

1 回答 1

1
  1. 通过使用mixins。
  2. 从技术上讲，您可以在运行时定义类并选择extend您认为合适的任何属性：
Ext.define('Grid.view.RuntimeGrid',{
    extend: 'Grid.view.' + (model.input.gridType === 'readonly' ? 'ReadonlyDataGrid' : 'EditableDataGrid'),
    //additional features
});

但这是不好的做法。

  1. 在运行时更改超类更糟糕。在设计方面，有两个看似的选择：

    • 有两个类，但不要重复自己：将“冗余/相同”代码放入一个 mixin 中，并将其包含在两个类中；或者
    • 只有一个类在配置为这样时可以编辑。它会接受一个配置选项说editable，并且只会在该选项是时实例化相关的编辑插件/编辑器true。
于 2015-06-23T08:58:34.643 回答