extjs4 - 获取 controle win Extjs Controller 参考的最佳方式

Question

我正在寻找一种使用 extjs refs 系统在我的窗口中引用两个控件的好方法。

这是我的视图代码：

Ext.define('App.view.Filter',{
extend: 'Ext.window.Window',
alias: 'widget.myfilter',
items: [
    {
        xtype: 'container',
        items: [
            {
                xtype: 'combobox'
            },
            {
                xtype: 'textfield'
            },
            {
                xtype: 'button',
                text: 'Search',
                action: 'search'
            }

        ]
    }
]

});

我想访问组合框和文本字段。我第一次尝试这样做：

refs: [
    {
        ref: 'combo',
        selector: 'myfilter combobox:first'
    },
    {
        ref: 'filter',
        selector: 'myfilter textfield:first'
    }
],

但是“过滤器”也得到了组合框。

Answer 1

将 itemId 属性添加到您的项目：

items: [
        {
            xtype: 'combobox',
            itemId: 'myCombobox'
        },
        {
            xtype: 'textfield',
            itemId: 'myTextfield'
        },
        {
            xtype: 'button',
            text: 'Search',
            action: 'search'
        }

    ]

然后你可以像这样引用它们：

refs: [
{
    ref: 'combo',
    selector: 'myfilter #myCombobox'
},
{
    ref: 'filter',
    selector: 'myfilter #myTextfield'
}
],

您的“过滤器”引用也获得了组合框，因为组合框类继承自文本字段，这就是为什么使用 itemId 属性通常更好的原因。

Answer 2

或者，

Ext.define('App.view.Filter',{
    extend: 'Ext.window.Window',
    alias: 'widget.myfilter',
    items: [{
        xtype: 'combobox',
        itemId: 'myCombobox'
    },{
        xtype: 'textfield',
        itemId: 'myTextfield'
    }]
});

window1 = Ext.create('App.view.Filter').show();
window2 = Ext.create('App.view.Filter').show();

window1.down('#myCombobox');

这样您就可以从您感兴趣的特定窗口中获取组件。查看文档以获取更多信息。