3

在 Sencha 的边界布局 API 中，它说：

ExtJS 4.0+ 中没有 BorderLayout.Region 类

我在各种博客上找到的访问中心面板是这样的：

var viewPort = Ext.ComponentQuery.query('viewport')[0];
var centerR = viewPort.layout.centerRegion;

再次查看文档，我看到这centerRegion是一个私有函数（为什么？），我不想依赖这些函数来进行未来的验证。此外，没有westRegion,northRegion等...

如何获得这些物品？
我当然可以获得区域内的项目：各种面板等，但我希望完全控制包含我的边框布局的视口。这就是我现在正在做的事情：

    var viewPort = Ext.ComponentQuery.query('viewport')[0];
    var view = Ext.widget('my-new-tab-panel');

    viewPort.layout.centerRegion.removeAll();
    viewPort.layout.centerRegion.add(view);

有没有更好的办法？

4

1 回答 1

2

通常，我为必须使用的每个容器设置一个 id。因此，我的中心区域将有一个 id，我将使用Ext.getCmp()函数获取它。

否则，要访问视口项目，您可以执行以下操作：

var viewPort = Ext.ComponentQuery.query('viewport')[0];
var view = Ext.widget('my-new-tab-panel');

viewPort.items.items[0].removeAll();
viewPort.items.items[0].add(view);

如果您将中心区域定义为视口的第一项，那么上面的代码就可以了，但是如果您将其定义为第三或第四项，那么您必须根据您的区域的位置（视口.items[3] 或 viewPort.items[4] 等）。

另一种方法是使用查询选择器：

var cr = viewPort.down('panel[region=center]');
cr.removeAll();
cr.add(view);

但是，按照这种方式，您必须查询精确的 xtype（在本例中为面板）。

无论如何，我认为最好的方法是为每个区域使用一个 id。

于 2012-09-23T12:11:43.270 回答