1

嗨，我正在尝试扩展表单，我可以使用像这样的 commonItems 这样的辅助属性来扩展项目。

Ext.define('PC.view.FormEvento', {
        extend:'Ext.form.Panel',
        id:'FormEvento',
        url:'controller/action',
        bodyPadding:10,
        commonItems:[
            {
                xtype:'hiddenfield',
                name:'id',
                value:0
            },
]});

..我像这样与扩展项目的形式相结合

Ext.define('PC.view.FormEventoExtended', {
    extend:'PC.view.FormEvento',
    id:'FormEventoExtended',
    title:'Evento Extended',

    initComponent:function () {
        var me = this;

        Ext.applyIf(me, {
            items:me.commonItems.concat(
                [
                    {
                        xtype:'textfield',
                        fieldLabel:'personal1',
                        name:'personal1'
                    },
                    {
                        xtype:'textfield',
                        fieldLabel:'personal2',
                        name:'personal2'
                    }
                ])
        });
        me.callParent(arguments);
    }
});

我将基本形式的 commonItems 连接到扩展形式的个人项目。在 Ext 4 中是否有一种可以原生的形式？

4

2 回答 2

3

I don't know any native way of doing this, but I prefer a "best practice" of putting in a method buildItems in every class extending Component, which returns an array with items:

Ext.define('PC.view.FormEvento', {
    extend: 'Ext.form.Panel',
    id: 'FormEvento',
    url: 'controller/action',
    bodyPadding: 10,

    initComponent: function () {
        this.items = buildItems();

        this.callParent(arguments);
    },

    buildItems: function () {
        return [
            {
                xtype: 'hiddenfield',
                name: 'id',
                value:0
            },
        ];
    }
]});

When you extend from this class, changing the items becomes a simple as overwriting the buildItems method, calling the parent and adding or inserting additional items:

Ext.define('PC.view.FormEventoExtended', {
    extend: 'PC.view.FormEvento',
    id: 'FormEventoExtended',
    title: 'Evento Extended',

    buildItems: function () {
        var items = this.callParent(arguments);

        return Ext.Array.push(items, [
            {
                xtype:'textfield',
                fieldLabel:'personal1',
                name:'personal1'
            },
            {
                xtype:'textfield',
                fieldLabel:'personal2',
                name:'personal2'
            }
        ]);
    }
});

When the number of items grows, it makes sense to create additional methods, e.g. buildFieldsetAddressItems. This comes with the benefit that your list of items stays more readable, imho.

于 2013-08-29T12:06:04.903 回答
2

您可以在PC.view.FormEvento构造函数中简单地编写如下内容：

initComponent: function() {
   var me = this;

   me.items.push({
      xtype:'hiddenfield',
      name:'id',
      value:0
   });
   me.callParent(arguments);
}

当这个构造函数被调用时，对象已经在子对象中配置了项目。

于 2012-07-30T16:36:56.183 回答