ExtJS4 MVC懒惰加载

ExtJS4 MVC Lazy Loading

本文关键字：加载 MVC ExtJS4      更新时间：2023-09-26

帮助！我有一个ExtJS 4.2 MVC应用程序，它将包含大量不同的视图。然而，每个用户只能访问整个集合的一小部分。显然，我不想为每个用户加载所有的视图！此外，每个"允许"的视图都应该在用户登录后加载。

在过去(MVC之前(，我使用Ext.create((来动态加载我的.js类文件。然而，我正在尝试使用MVC设计模式，我在网上读到的所有内容都表明，这似乎是ExtJS 4.2 MVC的限制。这是真的吗？以下是我迄今为止所做的尝试。

首先，自定义视图定义(一个基本的容器示例(：

Ext.define('My.custom.TestView', {
    extend: 'Ext.container.Container',
    alias: 'widget.myCustomTestView',
    html: 'Test',
    initComponent: function() {
        this.callParent(arguments);
    }
});

第二，试图加载/实例化自定义视图的控制器定义：

Ext.define('My.custom.TestController', {
    extend: 'Ext.app.Controller',
    // Empty array because I want to
    // add views during run-time.
    views: [
    ],
    init: function () {
        // Attempt #1: This produces an error.
        this.getView('My.custom.TestView').create();
        // Attempt #2: This returns null.
        Ext.widget('myCustomTestView');
        // Attempt #3: This appears it might work, but it's ugly!
        Ext.create('My.custom.TestView');
        this.getView('My.custom.TestView').create();
    }
});

虽然#3是唯一一个没有给出错误的，但在我看来并不正确。有什么建议/意见吗？

Ext.create((会导致同步加载，因此它实际上会检查视图的依赖js文件是否已加载，如果不是，那么它会同步加载js文件，并停止执行代码，直到Ext.Loader加载并初始化js。然后，您可以在类上获得view((.create((，因为您的视图类现在可以在Ext.中使用

对于其他两个：

  1. 会产生一个错误，因为它基于My.custom.TestView的谓词已经被加载，而事实并非如此，因此它无法在加载的类中找到类的定义来创建它的实例。

  2. 返回null很可能是因为Ext.widget的实现方式，以便保持对Ext.widget[(]的调用，该调用为尚未加载的类指定一个小部件名称，以防止破坏您的应用程序。

1和2与Ext.create((的不同之处在于，它们不调用Ext.Loader来解析类文件，并且如果未发现该类文件已在内部加载到Ext中，则将其加载。它们只是对已经加载的代码执行操作，并且在调用它们时在应用程序中可用。

值得在这里阅读Exts文档中的Ext.Loaderhttp://docs.sencha.com/extjs/4.2.1/#/api/Ext.Loader

相关文章：