如何從 extjs 拆分按鈕菜單訪問工具欄？

Question

我有一個這樣的工具欄

  tbar: [{
            xtype        : 'textfield',
            name        : 'number',
            itemId        : 'number',
            listeners    : {
                change    : function(t,n){
                        console.log(this.up('toolbar').down('#splitbut')) // i can access splitbutton from here
                }
            }                                                          
        },{
            xtype    : 'splitbutton',
            text    : 'Report',
            disabled: true,
            itemId    : 'splitbut',
            menu    : [{
                    text    : 'details',
                    handler    : function() {
                        // how to access #number text field  from here
                    }
                }

我在菜單按鈕處理程序中嘗試過 this.up('menu').up('toolbar') 但我嘗試的每種方式都收到未定義的消息

知道如何從菜單按鈕訪問#number 文本字段嗎？

問候

Answer 1

我會分別定義文本字段和拆分按鈕，然后以這種方式引用它們。

this.myTextField = new Ext.form.field.Text ({
    name: 'number',
    itemId: 'number',
    listeners: {
        change: function(t,n){
            console.log(this.mySplitButton) 
        }
    }    
this.mySplitButton= new Ext.button.Split ({
    text: 'Report',
    disabled: true,
    itemId: 'splitbut',
    menu: [{
        text: 'details',
        handler: function() {
            console.log(this.myTextField ) 
        }
    }   

Answer 2

Gihan 您的菜單項不會從具有 function 的組件擴展。 嘗試將 scope 傳遞給處理程序 function：

handler: function() {
            console.log(this.myTextField ) 
        },
scope: this or this.mySplitButton

在 function 中設置斷點並在螢火蟲中檢查它。 你會清楚地看到“this”指的是什么。 此外，如果您要在 ExtJS 中進行開發，我強烈建議您從開發人員那里獲得 Firefox 的照明 - 您會喜歡它。