1

下面，您将看到我在 Sencha ExtJS MVC 应用程序中创建的 MVC 视图出现了一个 JavaScript 异常。我有另一个扩展“Ext.tree.Panel”的 MVC 视图，它读取一个简单的 JSON 对象，而不是通过 Ext.Direct 代理和 .NET 服务器端堆栈提取数据，但唯一不同的是代理实现和当然是我们的 MVC 控制器逻辑。在静态 (JSON) 实现中，我们的代理在模型中定义。在动态（Ext.Direct）实现中，我们的代理是在 store 中定义的。TreeStructures.js（存储）JavaScript 文件不断被请求无限次，直到浏览器崩溃。有关该例外，请参见下文。

我非常怀疑这是一个 Ext.Direct 问题，因为我有其他商店在这种架构下工作得很好。我看到了 [Ext.Loader] 异常，但我不确定为什么这个异常会随着每个新的 TreeStructures.js 请求不断重复。或者在哪里实施需要。我的理解是 app.js 定义了控制器。然后控制器定义模型和存储。视口定义并实例化其他 MVC 视图。我的“其他视图”是树视图。视图实现了商店。

此外，Sencha Cmd“sencha app build”命令不起作用。通常，我的应用程序编译时没有任何问题，因此存储或 MVC 配置中肯定缺少此动态树所必需的某些内容。

JavaScript 控制台中的异常：

[Ext.Loader] Synchronously loading 'MyApp.store.TreeStructures'; consider adding Ext.require('MyApp.store.TreeStructures') above Ext.onReady

浏览器崩溃并出现此 JavaScript 异常：

注意：TreeStructures.js（存储）JavaScript 文件不断被请求无限次，直到浏览器崩溃：

Uncaught RangeError: Maximum call stack size exceeded

Sencha Cmd 错误（调用“sencha app build”命令后）：

[ERR] failed to find meta class definition for name MyApp.store.TreeStructures
[ERR] def was null
[ERR] C2008: Requirement had no matching files <MyApp.store.TreeStructures> -- unknown-file:-1

静态树实现（读取 JSON 对象获取数据）：

Ext.define('MyApp.store.Categories', {
    extend : 'Ext.data.TreeStore',
    model : 'MyApp.model.Category',
    autoLoad : true,
    root : {
        text : 'All',
        alias : '',
        expanded : true
    }
});

Ext.define('MyApp.model.Category', {
    extend: 'Ext.data.Model',
    fields: [
        { name: 'alias', type: 'auto' },
        { name: 'text', type: 'auto' }
    ],

    proxy: {
        type: 'ajax',
        url: 'data/categories.json'
    }
});

Ext.define('MyApp.controller.ConceptTreeReadonly', {
    extend : 'Ext.app.Controller',
    stores: ['Categories'],
    models: ['Category'],
    refs : [{
        ref: 'categories',
        selector: 'view-west'
    }],
});

动态树实现（使用服务器端堆栈获取数据）：

Ext.create('MyApp.store.TreeStructures', {
    extend: 'Ext.data.TreeStore',
    model : 'MyApp.model.TreeStructure',
    proxy: {
        type: 'direct',
        directFn: Concept_Tree_Structure.read,
        reader: {
            root: 'data'
        }
    },
    root: {
        text: 'Concept Tree',
        id: 'root',
        expanded: false
        //children: []
    },
    autoLoad: false
});

Ext.define('MyApp.model.TreeStructure', {
    extend: 'Ext.data.Model',
    xtype: 'model-tree-structure',

    fields: [
        { name: 'text' }, //  string                    
        { name: 'id' }, // Int32    type: 'int'
        { name: 'expanded' }, // boolean                   
        { name: 'leaf' }, // boolean       
        { name: 'children' } // List<TreeStructure>            
    ]
});

Ext.define('MyApp.controller.ConceptTreeController', {
    extend : 'Ext.app.Controller',

    stores: ['TreeStructures', 'Concepts'],
    models: ['TreeStructure', 'Concept'],

    refs : [{
        ref: 'concept-tree',
        selector: 'view-concept-tree'
    }],
    init : function() {

        this.getConceptsStore().load({
            params: {
                start: 0, 
                limit: 10,
                foo: 'bar'
            }
        });

        this.getTreeStructuresStore().load({
            params: {
                start: 0,
                limit: 10,
                foo: 'bar'
            }
        });
    }
});
4

1 回答 1

5

更改 Ext.create('MyApp.store.TreeStructures'...

到 Ext.define('MyApp.store.TreeStructures'...

于 2013-08-05T22:09:40.520 回答