试图让两个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

您的form有两个items定义，因此第二个仅优先覆盖，而不添加新的。 你也需要使用hbox layour父组件。

我更新了您的代码，请检查此小提琴 。