Class 扩展自己的类

我正在开发一个带有多个窗口的应用程序。许多窗口都是类似的，所以我想写一个超类，并扩展它

我有，超类：

Ext.define('AM.view.ui.DecoratorAbstract',{
    extend: 'Ext.window.Window',
    alias: 'widget.decoratorAbstract',

    initComponent: function(){
        this.title = this.aTitle;
        this.resizable = this.cfg[0];
        this.closable = this.cfg[1];
        this.minimizable = this.cfg[2];
        //this.items = this.anItem;
        this.callParent(arguments);
    }
});

和子类：

Ext.define('AM.view.ui.DecoratorForm',{
    extend: 'AM.view.ui.DecoratorAbstract',
    alias: 'widget.decoratorForm',

    initComponent: function(){  
        this.callParent();
        this.buttons = [
            { text:'Guardar', action:'save', iconCls: 'ico-save' },
            { text:'Cancelar', action:'cancel', iconCls: 'ico-cancel' }
        ];
    }
});

Ext.create('AM.view.ui.DecoratorForm',{cfg:[true,true,true],aTitle: 'Title'}).show();

这两个类都包含在控制器中：

Ext.define('AM.controller.Ui',{
    extend: 'Ext.app.Controller',

    views: [
        'ui.Toolbar',
        'ui.Statusbar',
        'ui.AlertErr',
        'ui.AlertOk',
        'ui.AlertWar',
        'ui.AlertDelete',
        'ui.AlertUndelete',
        'ui.DecoratorAbstract',
        'ui.DecoratorForm',
        'ui.DecoratorGrid'
    ],
    model: [],
    store: [],
});

我从Firebug js控制台创建子类：

Ext.define('AM.view.ui.DecoratorForm',{
    extend: 'AM.view.ui.DecoratorAbstract',
    alias: 'widget.decoratorForm',

    initComponent: function(){  
        this.callParent();
        this.buttons = [
            { text:'Guardar', action:'save', iconCls: 'ico-save' },
            { text:'Cancelar', action:'cancel', iconCls: 'ico-cancel' }
        ];
    }
});

Ext.create('AM.view.ui.DecoratorForm',{cfg:[true,true,true],aTitle: 'Title'}).show();

显示窗口，但不显示按钮。 有什么想法吗？

如果你搬家了怎么办

this.callParent(arguments);

---

在decororform中的initComponent的末尾。

这里有一些东西。。。首先，将

this.callParent（）

移动到

initComponent

的末尾。这是因为继承之后的

initComponent

使用

This.buttons

执行某些操作，而在设置按钮之前调用

callParent

，则会忽略这一点

接下来，您真的不应该使用您正在传递的

cfg

东西。只需传入要使用的配置参数，即可使用：

Ext.define('AM.view.ui.DecoratorAbstract',{
    extend: 'Ext.window.Window',
    alias: 'widget.decoratorAbstract',

    initComponent: function(){
        this.callParent(arguments);
    }
});

Ext.define('AM.view.ui.DecoratorForm',{
    extend: 'AM.view.ui.DecoratorAbstract',
    alias: 'widget.decoratorForm',

    initComponent: function(){
        this.buttons = [
            { text:'Guardar', action:'save', iconCls: 'ico-save' },
            { text:'Cancelar', action:'cancel', iconCls: 'ico-cancel' }
        ];
        this.callParent();
    }
});

//to instantiate:
Ext.create('AM.view.ui.DecoratorForm',{
    resizable: true,
    closable: true,
    minimizable: true,
    title: 'Title'
}).show();

每当您试图通过使用类似于

cfg

array的东西来“欺骗”组件时，您都应该重新思考您正在做什么，看看是否有更聪明的方法

您还应该研究一下如何使用

Ext.apply（）

。通过将以前的内容更改为以下内容，它将节省大量字节：

Ext.apply(this, {
    title: 'my title',
    resizable: cfg[0],
    closable: cfg[1],
    ///...etc...
})

---

严格地说，

initComponent

不接收任何参数

this.callParent（）应该足够了。