试图让两个vbox彼此​​相邻

Question

我有两个vbox我希望彼此相邻。但是，只有第一个出现。这是为什么以及如何更改它？这是我的代码

  layout: 'fit',
  title: 'Avail Requests Details',
  minWidth: 1000,
  minHeight: 600,
  width: 1174,
  height: 600,
  autoShow: true,
  //listeners: {
  //    beforedestroy: 'onBeforeDestroy'
  //},

  items: [{
    xtype: 'form',
    reference: 'viewForm',
    bodyPadding: 10,
    defaults: {
      xtype: 'container',
      height: 25,
      layout: {
        type: 'column'
      },
      defaults: {
        columnWidth: 0.3,
        labelWidth: 140
      }
    },
    layout: {
      type: 'vbox',
    },
    items: [{
      xtype: 'displayfield',
      fieldLabel: 'CHANNEL',
      name: 'Channel'
    },
    {
      xtype: 'displayfield',
      fieldLabel: 'ADVERTISER',
      name: 'AdvertiserName'
    },
    {
      xtype: 'displayfield',
      fieldLabel: 'DEMO',
      name: 'Demo'
    },
    {
      xtype: 'displayfield',
      fieldLabel: 'COMMENTS',
      name: 'comments'
    }],
    layout: {
      type: 'vbox',
    },
    items: [{
      xtype: 'displayfield',
      fieldLabel: 'CHANNEL',
      name: 'Channel'
    },
    {
      xtype: 'displayfield',
      fieldLabel: 'ADVERTISER',
      name: 'AdvertiserName'
    },
    {
      xtype: 'displayfield',
      fieldLabel: 'DEMO',
      name: 'Demo'
    },
    {
      xtype: 'displayfield',
      fieldLabel: 'COMMENTS',
      name: 'comments'
    }]
  }]
});

Answer 1

您的hbox中有两个{{1}}定义，因此第二个只是首先覆盖，而不是添加新的定义。此外，您必须使用{{1}} layour作为父组件。

我更新了您的代码，请检查this fiddle。