Question

我有一个extJS边框布局。我的组件放置在所有四个区域中。现在，我给出了split属性（也split: true），splitter工作正常，但是splitter应该显示在边框之间，并且没有发生。

仅当我将鼠标悬停在边框上时，拆分器才会显示。这是我的代码。任何骇客都会很棒。

Ext.onReady(function() {
    Ext.create('Ext.panel.Panel', {
       renderTo: Ext.getBody(),
       height: 300,
       width: 600,
       layout:'border',

       defaults: {
         // collapsible: true,
          split: {
              size :10
          },
          bodyStyle: 'padding:15px'
       },
       items: [{
          title: 'Panel1',
          region:'west',
          html: 'This is Panel 1'
       },{
          title: 'Panel2',
          region:'center',
          html: 'This is Panel 2'
       },{
          title: 'Panel3',
          region: 'south',
          html: 'This is Panel 3'
       },{
          title: 'Panel4',
          region: 'east',
          html: 'This is Panel 4'
       },{
          title: 'Panel5',
          region: 'north',
          html: 'This is Panel 5'
       }]
    });
 });

Answer 1

一种快速的技巧是使用“ collapsible：true”，这会在寄宿生身上显示一个小箭头。

Ext.create('Ext.panel.Panel', {
   renderTo: Ext.getBody(),
   height: 300,
   width: 600,
   layout:'border',

   defaults: {
     // collapsible: true,
      split: {
          size :10
      },
      collapsible: true,
      //collapseMode: 'mini',
      bodyStyle: 'padding:15px'
   },
   items: [{
      title: 'Panel1',
      region:'west',
      html: 'This is Panel 1'
   },{
      title: 'Panel2',
      region:'center',
      html: 'This is Panel 2'
   },{
      title: 'Panel3',
      region: 'south',
      html: 'This is Panel 3'
   },{
      title: 'Panel4',
      region: 'east',
      html: 'This is Panel 4'
   },{
      title: 'Panel5',
      region: 'north',
      html: 'This is Panel 5'
   }]
});

拆分栏（拆分器）未显示。仅在鼠标悬停时，拆分器才会显示

1 个答案: