La difficulté avec TreeStore dans ExtJS 4.0 application MVC

La nouvelle version de ExtJS pouvez faire votre chrome instable (Ou est-ce mon code?)! Laissez-moi vous expliquer ma situation.

Je suis en train de travailler sur la nouvelle architecture MVC de ExtJS 4.0. J'ai un arbre de panneau d'affichage de mon menu applications ou de navigation. Comme pour l'architecture, j'ai essayé de diviser mon arborescence dans le contrôleur, vue et d'un magasin séparé.

Voici mon avis:

 Ext.define('CRM.view.menu.View', {
    alias: 'widget.menutree',
    extend: 'Ext.tree.Panel',

    initComponent: function() {

        console.log('initComponent of View...');

        Ext.apply(this, {
            title: 'Simple Tree',                       
            width: 200,             
            store: 'MainMenu',
            rootVisible: false
        });

        this.callParent(arguments);
    }
});

Mon arbre en magasin:

 Ext.define('CRM.store.MainMenu', {
    extend: 'Ext.data.TreeStore', 

    constructor: function() {

        console.log('Constructor of MainMenu TreeStore');

        config = Ext.apply(this,{
            proxy: {
                type: 'ajax',
                url: 'data/menu.json'
            },root: {
                text: 'Menu',
                id: 'src',
                expanded: true
            }
        });

        this.callParent(arguments);

    }
}); 

Et dans mon contrôleur, j'ai fourni à mon magasin d'infos. Voici une partie de mon contrôleur config:

Ext.define('CRM.controller.MainMenu',{
    extend: 'Ext.app.Controller',
    stores: ['MainMenu'],   
    refs: [
        {ref:'menu',selector: 'menutree'},
        {ref:'cp',selector: 'centerpane'}
    ],
        .
        .
        .

Sur l'exécution initiale, j'obtiens l'erreur suivante:

Objet MainMenu n'a pas de méthode
'getRootNode'

Mais maintenant, je reçois plus d'erreur bizarre:
Notez que chrome s'arrête l'exécution dans le constructeur de l'arbre magasin.

Dans le même temps, dans firefox:
Firefox exécute mieux, mais l'application n'est pas rendus!

Après quelques piste et erreur.. j'ai trouvé un moyen d'obtenir mon application en cours d'exécution.. et c'est pour éviter à l'aide de mon magasin et de fournir directement le magasin d'informations comme indiqué ci-dessous:

 Ext.define('CRM.view.menu.View', {
    alias: 'widget.menutree',
    extend: 'Ext.tree.Panel',

    initComponent: function() {

        console.log('initComponent of View...');

        Ext.apply(this, {
            title: 'Simple Tree',                       
            width: 200,             
            store: {
                proxy: {
                    type: 'ajax',
                    url: 'data/menu.json'
                },root: {
                    text: 'Menu',
                    id: 'src',
                    expanded: true
                }
            },
            rootVisible: false
        });

        this.callParent(arguments);
    }
});

Maintenant l'application s'exécute sans problèmes à tous!

Quelqu'un a-t essayez de créer l'arborescence en utilisant l'architecture MVC? Je n'ai aucune idée sur comment résoudre ce problème!

OriginalL'auteur Abdel Raoof | 2011-05-09