Model view controller 如何在extjs4中使用控制器控制菜单

我正在尝试使用extjs4mvc构建一个crmweb应用程序。 在设计了一个简单的网页之后，我尝试使用控制器来控制左侧面板上的菜单。 但是控制器对我来说太难理解了

由于ui设计上的一些原因，在菜单树面板的外部有一个面板

这是我的代码。

app/view/MenuBar.js

Ext.define('Crm.view.MenuBar',{
    extend: "Ext.panel.Panel",
    alias: 'widget.crm_menubar',
    requires: ['Crm.store.Menus'],
    initComponent: function(){
    var store = Ext.create('Crm.store.Menus');
    Ext.apply(this,{
        xtype:'panel',  
        title: "menu"
        width: 212,
        frame:true,
        hideCollapseTool:true,
        split: true,
        collapsible:true,
        collapseMode: 'mini',
        items: [
            Ext.create('Ext.tree.Panel',{
                id: 'menutree',
                border: false,
                height: '100%',
                rootVisible: false,
                store: store
            })
        ]
    });
    this.callParent();
    }
});

app/store/Menus.js

Ext.define('Crm.store.Menus',{
    extend: 'Ext.data.TreeStore',
    root: {
            expanded: true, 
            children: [
                {   text: "subrootitem1",
                    expanded: true,
                    children:[
                    { id: 'a', text: "item1", leaf: true},
                    { id: 'b', text: "item2", leaf: true },
                    ]
                },
                {   text: "subrootitem2", 
                    expanded: true, children: [
                        { id: 'c', text: "item1", leaf: true },
                        { id: 'd', text: "item2", leaf: true}
                    ]
                }
            ]
        }
});

app/controller/Menu.js

Ext.define('Crm.controller.Menu',{
    extend: 'Ext.app.Controller',
    refs: [{ref: 'menubar', selector: 'crm_menubar'}],
    init: function(){
        alert('test'); // this line can already execute when page is loading  
        this.control({
            'crm_menubar': {
                itemmousedown: this.onItemClicked
            }
        });
    },
    onItemClicked: function(){
        alert('clicked');
    }
});

我想和菜单互动。但是这行代码不起作用。

---

“参考文献”终于变得模糊不清了。您能给我一些解决方案吗？

尝试将您的控制器注册到树面板：

this.control({
“crm_菜单栏树面板[id=“menutree”]”：{
itemclick:this.onitemclick，
范围：本
}
});

没问题。如果这是你问题的解决方案，那就接受它作为答案吧。