extjs - 如何在ExtJS TextField组件中的Label和TextField之间插入另一个组件？

Question

TextField ExtJS 4.2.1 提供的基本上是 Label和一个 TextField里面 Container设置为布局hbox .

我需要插入ComboBox在Label之间和 TextField里面Container .

我尝试过 extend TextField类，但找不到任何具体显示将组件添加到另一个组件层次结构的适当语法的内容。

有人可以发布一个答案代码片段或链接到一些内容，向 ExtJS 的新手解释如何像我一样扩展组件并修改它吗？

我只需要指明正确的方向，我想我可以顺其自然。

Answer 1

您正在寻找Ext.form.field.FieldContainer

这是最简单的例子:

Ext.create('Ext.form.Panel', {
    title: 'FieldContainer Example',
    width: 550,
    bodyPadding: 10,

    items: [{
        xtype: 'fieldcontainer',
        fieldLabel: 'Last Three Jobs',
        labelWidth: 100,
        layout: 'hbox',
        items: [{
            xtype: 'combo',
                store: {
                fields: ['abbr', 'name'],
                data : [
                    {"abbr":"AL", "name":"Alabama"},
                    {"abbr":"AK", "name":"Alaska"},
                    {"abbr":"AZ", "name":"Arizona"}
                ]
            },
            queryMode: 'local',
            displayField: 'name',
            valueField: 'abbr',
            flex: 1
        }, {
            xtype: 'splitter'
        }, {
            xtype: 'textfield',
            flex: 1
        }]
    }],
    renderTo: Ext.getBody()
});

您还可以使 fieldContainer 充当单个字段。快速解释:

• 混合Ext.form.field.Field
• 将内部字段 submitValue 设置为 false