Question

可能重复：
Extjs4.1, up() down() versus Ext.getCmp()

我使用ExtJS（总是使用版本4）工作很多但是我仍然有问题需要了解检索组件的正确方法。

有许多方法可以做到，全球：

Ext.getCmp ()
Ext.ComponentQuery.query ()

和内部：

Ext.container.AbstractContainer.down ()
Ext.container.AbstractContainer.up ()
Ext.container.AbstractContainer.nextSibling ()
Ext.container.AbstractContainer.nextNode ()
Ext.container.AbstractContainer.previousSibling ()
Ext.container.AbstractContainer.previousNode ()
Ext.container.AbstractContainer.child ()
Ext.container.AbstractContainer.findParent ()
Ext.container.AbstractContainer.findParentBy ()
Ext.container.AbstractContainer.query ()
Ext.container.AbstractContainer.queryBy ()
Ext.container.AbstractContainer.queryById ()

现在，如果我为每个组件使用 id （如按钮，复选框，网格等），我肯定会总是得到它们，即使主容器的布局发生变化：我可以按照全球方式做到这一点。但是，这种搜索可能会影响应用程序的性能：老实说，我不知道Ext.getCmp ()是如何工作的，但我认为搜索是在整个变量命名空间中完成的。

所以，这个问题导致我偶尔跟随第二种方式。当我改变主容器的布局时会出现问题。举个例子如下：

Ext.create ('Ext.panel.Panel', {
    title: 'Main Container' ,
    width: 300 ,
    renderTo: Ext.getBody () ,
    items: [{
        xtype: 'textfield' ,
        fieldLabel: 'First name'
    } , {
        xtype: 'textfield' ,
        id: 'tfLastName' ,
        fieldLabel: 'Last name'
    } , {
        xtype: 'checkbox' ,
        boxLabel: 'Alive'
    }] ,

    bbar: {
        xtype: 'toolbar' ,
        items: [{
            xtype: 'button' ,
            text: 'Get CheckBox' ,
            // Gets the checkbox starting from the second textfield (Last Name)
            handler: function (btn) {
                var tfLastName = Ext.getCmp ('tfLastName');
                console.log (tfLastName.nextSibling ('checkbox'));
            }
        }]
    }
});

当我点击获取复选框按钮时，它会返回我请求的复选框但是如果我更改主容器项目的顺序（假设在之前放置复选框声明姓氏 textfield）它按预期返回null。现在，这是问题：我不想在更改视图时更改逻辑。

所以，我的问题是：

是否存在一个允许我在不使用Ids的情况下检索组件并在视图更改时保持逻辑不变的函数？
是否存在检索组件的正确方法？如果是，那该怎么办？

Extjs 4：检索组件的正确方法是什么？

0 个答案: