2

哪种是扩展/子类组件的正确方法?

Ext.define('Holidays.Components.UserInfo', {
extend: 'Ext.panel.Panel',
alias: 'widget.UserInfo',
region: 'west',
split: true,
title: 'Categories',
width: 300,
collapsible: true,
layout: 'border',
animCollapse: false,

initComponent: function () {
    var me = this;

    Ext.apply(me, {
        items: [{
            xtype: 'panel',
            region: 'center',
            border: false
        }, {
            xtype: 'panel',
            title: 'Tab 2',
            region: 'south',
            collapsible: true,
            height: 200
        }, ]
    });
    me.callParent(arguments);
}
});

或这个:

Ext.define('Holidays.Components.UserInfo', {
extend: 'Ext.panel.Panel',
alias: 'widget.UserInfo',

initComponent: function () {
    var me = this;

    Ext.apply(me, {
        width: 300,
        collapsible: true,
        layout: 'border',
        animCollapse: false,
        region: 'west',
        split: true,
        title: 'Categories',
        items: [{
            xtype: 'panel',
            region: 'center',
            border: false
        }, {
            xtype: 'panel',
            title: 'Tab 2',
            region: 'south',
            collapsible: true,
            height: 200
        }, ]
    });
    me.callParent(arguments);
}
});

当我使用第一个版本创建我的类的实例时,像这样

this.userPanel = Ext.create("Holidays.Components.UserInfo");

我的面板在折叠时有动画,并且我得到了奇怪的布局行为。

我可以在定义中设置哪些属性,在 initComponent 中必须设置哪些属性?

4

1 回答 1

1

您将在此处找到标题问题的完整解释。另请阅读我留给分子人的评论,并查看我评论中包含的链接。

我不确定为什么你在第一个版本中会出现这种奇怪的行为,因为我知道这不应该是这种情况。您能否让我们知道在使用第一个版本时会发生什么,但在 InitComponent中有layout和配置?animCollapse此外,您是否有机会多次创建此组件?

于 2012-06-27T09:46:02.097 回答