model-view-controller - Extjs4如何更改树面板中的商店

Question

我在“app/store/”中有一些菜单树存储，例如“menu1.js”、“menu2.js”。
在我的网页中，我在顶部区域有一个导航栏，其中有许多按钮可以控制左侧区域的菜单树以更改菜单。但我不知道如何更改此树面板中的商店。
这是我的代码:

应用程序/商店/Menus1.js

Ext.define('Crm.store.Menus1', {
    extend: 'Ext.data.TreeStore',
    root: {
        expanded: true, 
        children: [{    
            text: "subroot1",
            expanded: true,
            children:[
                { id: 'item01', text: "item1", leaf: true },
                { id: 'item02', text: "item2", leaf: true },
            ]
        }, {
            text: "subroot2",, 
            expanded: true, 
            children: [
                { id: 'item03', text: "item3", leaf: true },
                { id: 'item04', text: "item4", leaf: true }
            ]
        }]
    }
});

应用程序/商店/Menus2.js

Ext.define('Crm.store.Menus2', {
    extend: 'Ext.data.TreeStore',
    root: {
        expanded: true, 
        children: [{
            text: "subroot1",
            expanded: true,
            children:[
                { id: 'item05', text: "item5", leaf: true },
                { id: 'item06', text: "item6", leaf: true },
            ]
        }, {
            text: "subroot2",, 
            expanded: true, 
            children: [
                { id: 'item07', text: "item7", leaf: true },
                { id: 'item08', text: "item8", leaf: true }
            ]
        }]
    }
});

app/view/MenuBar.js(即:我没有设置它的商店)

Ext.define('Crm.view.MenuBar', {
    extend: "Ext.panel.Panel",
    alias:'widget.crm_menubar',
    initComponent: function() {
        Ext.apply(this, {
            id: 'crm-menuBar',
            xtype:'panel',
            width: 212,
            frameHeader:false,
            hideCollapseTool:true,
            split: true,
            collapsible:true,
            collapseMode: 'mini',
            items: [
                Ext.create('Ext.tree.Panel', {
                    id: 'menutree',
                    border: false,
                    margin:'5 4 0 4',
                    height: '98%',                  
                    rootVisible: false,
                }),
            ]
        });
        this.callParent();
    }
});

应用程序/ Controller /Navi.js

Ext.define('Crm.controller.Navi', {
    extend: 'Ext.app.Controller',
    requires: [ 'Crm.store.Menus1', 'Crm.store.Menus2' ],
    stores: [ 'Menus1'，'Menus2' ],
    refs: [
        { ref: 'crm_naviationBar', selector: 'crm_naviationBar' },
        { ref: 'crm_menubar', selector: 'crm_menubar' } 
    ],
    init: function(){
        var menutree = Ext.getCmp('menutree');
        var menustore = menutree.getStore();
        menustore = Menus1;   // I want initial the menu's store with Menus1
        //menustore = Ext.create('Crm.store.Menus1');  

        this.control({
            'button': {
                click: this.onItemClicked,
                scope: this
            } 
        });
    },
    onItemClicked: function(btn,eventObj){
        var menustore = Ext.getCmp('menutree').getStore();
        var btnId = btn.getId();

        if (btnId == 'btn_menus1') { //When button1 is clicked, change menu to menus1
            menustore = Menus1;
            //menustore = Ext.create('Crm.store.Menus1');       
        } else if (btnId == 'btn_menus2') { //When button2 is clicked, change menu to menus2
            menustore = Menus2;
            //menustore = Ext.create('Crm.store.Menus1');
        }
    }
});

Answer 1

不幸的是，这是 Sencha 已经忽略了很多很多个月的错误 :(

http://www.sencha.com/forum/showthread.php?143843-Calling-reconfigure%28%29-on-Ext.tree.Panel-throws-error