Question

我开发了一个带有几个窗口的应用程序。很多窗口都很相似，所以我想写一个超类，然后扩展它。

我有，超类：

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' }
        ];
    }
});

两个类都包含在Controller中：

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.create('AM.view.ui.DecoratorForm',{cfg:[true,true,true],aTitle: 'Title'}).show();

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

Answer 1

这里有一些事情......首先，将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数组的东西来“欺骗”组件，你应该重新思考你正在做什么，看看是否有更聪明的方法。

您应该考虑使用的另一件事是Ext.apply()。它会通过改变之前的内容来节省大量字节：

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

Answer 2

如果你搬家怎么办

this.callParent(arguments);

到DecoratorForm中的initComponent的末尾。

扩展自己的课程

2 个答案: