披露添加到一個字段場

Question

我有這樣一個字段：

Ext.define('admin.view.BuzzEditForm', { 
    extend: 'Ext.form.Panel', 
    requires: ['Ext.form.FieldSet','Ext.Img'], 
    id: 'editorPanel', 
    xtype: 'buzzEditForm', 
    config: { 
     /* modal: true, 
     hideOnMaskTap: false, 
     centered: true, 
     width: 500, 
     scrollable: false,*/ 
     items: [{ 
      xtype: 'fieldset', 
      items: [ 
       { 
        xtype: 'textfield', 
        name: 'keyword', 
        label: 'Mots clés' 
       }, 
       { 
        xtype: 'textfield', 
        name: 'title', 
        label: 'Titre' 
       }, 
       { 
        id: 'editorPanelvisual', 
        xtype: 'field', 
        label: 'Visuel actuel', 
        component: { 
         xtype: 'image', 
         src: '', 
         height: 200 
        } 
       }, 
       { 
        xtype: 'textfield', 
        name: 'visual', 
        label: 'Visuel' 
       } 
      ] 
     }] 
    } 
}); 

，我想一個按鈕添加到我的editorPanelvisual領域。我怎樣才能做到這一點？

Answer 1

這需要你更深入的瞭解有關Ext.data.Field：

component是輸入字段，並默認一個特殊的配置，它被設置爲{xtype: "input", type: "text"}，這是這個變通的關鍵。與flex配置

擴展您的textfield VS button寬度試試這個：

{ 
    id: 'editorPanelvisual', 
    xtype: 'field', 
    component: { 
     xtype: 'container', 
     layout: 'hbox', 
     items: [ 
     { 
     xtype: 'textfield', 
     flex: 3, 
     }, 
     { 
     xtype: 'button', 
     flex: 1, 
     text: 'test' 
     } 
     ]}, 
},