如何在extjs 3.4面板項中添加函數處理函數

Question

。當我運行並點擊圖標按鈕時，它不能夠調用函數func_1（）;什麼都沒有出現。在屏幕上

Ext.onReady(function() { 
    function func_1() { 
     //some functionality 
    } 

    new_win = new Ext.Panel({ 
     renderTo: Ext.getBody(), 
     activeItem: 0, 
     tbar: { 
      items: [{ 
       text: 'List', 
       ref: '../prevButton', 
       disabled: true, 
       handler: function() { 
        new_win.getLayout().setActiveItem(0); 
        new_win.prevButton.disable(); 
        new_win.nextButton.enable(); 
       } 

      }, '-', { 
       text: 'Icon', 
       ref: '../nextButton', 
       handler: function() { 
        new_win.getLayout().setActiveItem(1); 
        new_win.prevButton.enable(); 
        new_win.nextButton.disable(); 
       } 
      }] 
     }, 
     items: [{ 
      html: 'hello' 
     }, { 
      handler: function() { 
       func_1(); 
      } 
     }] 
    }); 
}); 

你能告訴我如何調用func_1（）;或面板項目中的處理程序？

Answer 1

沒有必要從匿名函數中調用函數，您可以直接從處理函數中引用它。

例如：

tbar: { 
        items: { 
         xtype: 'toolbar', 
         style: 'border:0;', 
         items: [{ 
          xtype: 'buttongroup', 
           items: [{ 
            id: 'btnAddItem', 
            text: 'Add Item', 
            icon: 'images/icons/add-icon.png', 
            handler: add_item 
           }] 
          }] 
         } 
       }, 
... 
function add_item(){ 

} 

Answer 2

你應該創建一個全局變量，然後你可以將處理這樣內見範圍：

Ext.onReady(function() { 

var me = this; 

function func_1() { 
    //some functionality 
} 

new_win = new Ext.Panel({ 
    renderTo: Ext.getBody(), 
    activeItem: 0, 
    tbar: { 
     items: [{ 
      text: 'List', 
      ref: '../prevButton', 
      disabled: true, 
      handler: function() { 
       new_win.getLayout().setActiveItem(0); 
       new_win.prevButton.disable(); 
       new_win.nextButton.enable(); 
      } 

     }, '-', { 
      text: 'Icon', 
      ref: '../nextButton', 
      handler: function() { 
       me.func_1(); 
       new_win.getLayout().setActiveItem(1); 
       new_win.prevButton.enable(); 
       new_win.nextButton.disable(); 
      } 
     }] 
    }, 
    items: [{ 
     html: 'hello' 
    }, { 
     handler: function() { 
      func_1(); 
     } 
    }] 
});