extjs 4.2.1 - 工具栏和将点击事件委托给按钮

Posted

技术标签:

【中文标题】extjs 4.2.1 - 工具栏和将点击事件委托给按钮【英文标题】:extjs 4.2.1 - Toolbar and delegating click events to buttons 【发布时间】:2014-01-12 02:35:29 【问题描述】:

我在谷歌上搜索,但没有找到任何关于这个问题的答案......

我有一个工具栏,里面有多个按钮。我将如何将点击事件委托给工具栏中的每个按钮,而无需编写如下内容:


    xtype: 'button',
    text: 'Click me',
    handler: function() 
        // do something...
    

每个按钮?

【问题讨论】:

我不是。我的计划是让 Toolbar 功能有点像 TabPanel,所以我需要做的就是在不同的面板之间切换。 【参考方案1】:

根据您的 cmets,我会这样做:

Ext.define('MyContainer', 
    extend: 'Ext.container.Container',

    initComponent: function() 
        var handler = this.handleButton;
        this.defaultType = 'button';
        this.items = [
            text: 'A',
            key: 'itemA',
            handler: handler
        , 
            text: 'B',
            key: 'itemB',
            handler: handler
        , 
            text: 'C',
            key: 'itemC',
            handler: handler
        , 
            text: 'D',
            key: 'itemD',
            handler: handler
        ];
        this.callParent();
    ,

    handleButton: function(btn) 
        console.log(btn.key);
        // do something with key
    
);

Ext.onReady(function() 

    new MyContainer(
        renderTo: document.body
    );

);

【讨论】:

我最终使用了 MVC :\ 但是还是谢谢。我想这以后会派上用场的。 方法还是有点类似的。

以上是关于extjs 4.2.1 - 工具栏和将点击事件委托给按钮的主要内容,如果未能解决你的问题,请参考以下文章

第二十章分离应用程序逻辑并处理事件

是否真的所有 ExtJS 组件都没有点击事件

如何在 Extjs 4 标签上添加点击事件

ExtJS 3.4 分页工具栏中的刷新完成事件

javascript事件委托

JQ事件委托导致点击事件多次执行问题