如何从特定方法触发我的处理程序？

Question

我已经从 Ext.Component 创建了一个实例类来使用 ul 标记。
这是演示 这就是我使用 contentMenu 的方式：

{
    xtype : "contentmenu"
    title : "Data Master",
    items : [{
        id : "action-siswa",
        iconCls : "icon-monitor",
        text : "Siswa",
        handler : function(){
            console.info("aaaa");
        }
    },{
        id : "action-sekolah",
        iconCls : "icon-monitor",
        text : "Sekolah",
        handler : function(){
            console.info("aaaa");
        }
    }]
}]

如何执行我的处理程序？？？ 我想在方法 doAction 中执行我的处理程序..

Answer 1

这是您的情况，您的 contentmenu 小部件将其项目创建为 dom，并且无法看到其处理程序属性，因为这些项目已在 initComponent 部分中删除。

我知道为什么你需要这样做，因为你需要一个干净的面板项目渲染模板。因此，这个问题的解决方案是使用显式的 contentmenu items 属性，该属性不会受到 initComponent 中渲染过程的干扰，但可以在 doAction 中访问。

请参阅下面的代码：

Ext.onReady(function() {

    Ext.define("Ext.ux.ContentMenu", {
        extend: "Ext.panel.Panel",
        alias: "widget.contentmenu",

        tpl: new Ext.XTemplate('<tpl for=".">', '<li style="margin: 3px 3px 3px 3px;">', '<img src="', Ext.BLANK_IMAGE_URL, '" class="{iconCls}" style="height:16px;margin-bottom:2px;margin-right:7px;vertical-align:middle;width:16px;"/>', '<a id="{id}" href="#" style="color:#3764A0;font-size:11px;text-decoration:none;">{text}</a>', '</li>', '</tpl>'),

        initComponent: function() {
            var c = this;
            var items = c.items; //temp items var
            delete c.items;  //need to do this to get clean panel display
            c.data = items;
            this.callParent();
            c.menus = items; //items is stored as menus property for the contentmenu
        },
        afterRender: function() {
            var m = this;
            m.callParent();
            b = m.body;
            b.on('mousedown', this.doAction, this, {
                delegate : "a",
                preventDefault: true,
                stopEvent: true
            });
        },
        doAction: function(a, b) {
            //Do the items handler
            Ext.each(this.menus, function(name, idx, arr) {
                if(arr[idx].id === b.id) { //found matched menu items
                    arr[idx].handler(); //do the handler
                    return false; //break here
                }
            });
        }
    });

    Ext.create("Ext.Window", {
        title: "aaa",
        width: 200,
        height: 150,
        layout: "fit",
        defaults: {
            xtype: "contentmenu"
        },
        items: [{
            title: "Data Master",
            items: [{
                id: "action-siswa",
                iconCls: "icon-monitor",
                text: "Siswa",
                handler: function() {
                    Ext.Msg.alert("Action Siswa","Handler action-siswa");
                }},
            {
                id: "action-sekolah",
                iconCls: "icon-monitor",
                text: "Sekolah",
                handler: function() {
                    Ext.Msg.alert("Action Sekolah","Handler action-sekolah");
                }
            }]
        }]
    }).show();
});

也许这对您有帮助

Answer 2

你的意思是...

Ext.getCmp('action-sekolah').handler();