ExtJS MVC 约定、命名和行为

Question

最近 (2.x / 3.x) 我只是使用 xtype 和工厂方法来接收一个同样快速的类的实例。现在我已经开始了 4.x 和我的第一个 MVC 应用程序。如教程中所述，MVC 模式要求我为每个不想使用的视图扩展一个类，即使我只使用一次。但是 Sencha 自己写的最佳实践说：

只是为了可重用性或添加功能而扩展

在我的情况下，我需要注册一大堆类，即使它们可以从一个基类创建，但 title, width,... 等一些参数除外

另外一点是，Controller 按照约定覆盖了任何 StoreId，并且还需要严格输入，这意味着类名必须以 s 结尾。但据我所知，我既不能保留模型也不能保留控制器存储/模型数组中的存储，因此该约定是否还有其他要点，因为它似乎没有多余的输入。

下一点是，在从 3.X 合并到 4.X 后，应用程序的初始加载时间已经延长，这似乎是由于需要定义的许多新类或由于所有控制器都得到了由于 MVC 模式的默认行为，在启动时实例化。有没有办法不自动实例化控制器而只是懒惰地做它，例如当我在应用程序控制器上请求它时？

是的，我知道，这是一堆问题，但我猜它们都围绕同一个主题。

编辑

经过一些源代码挖掘后，我不再确定 命名商店时s 的要求。我以为我绊倒了 这在浏览 MVC 教程时。任何人都可以验证这一点吗？

编辑 2

我的结论

花边渲染非常简单。首先 Controller 不应该在 ApplicationController 控制器数组中被提及。要创建此类控制器的实例，请使用 ApplicationController.getController(pureClassName) [请注意，每个控制器都包含对 ApplicationController 的引用，称为 application] 现在您需要注意以下事实：init(application) 方法和 onLaunch(application) 方法不再被ApplicationController，你需要自己做这个。当调用getController() 时，ApplicationController 首先查找内部引用缓存中是否已经存在此控制器的实例，如果没有，它会创建一个实例并将控制器名称注入为Id。所以控制器是一种非常好的单例。 控制器本身为注册的商店、模型和视图创建了所有的 getter，这是一个猜测，它实例化它们（至少是商店） 关于 store 的命名限制，s 结尾没有限制。

Answer 1

1.Izhaki 很好地回答了您关于延迟控制器初始化的问题。

2.我并没有真正关注您对商店名称的抱怨。商店名称没有限制。它们只是命名约定的建议。

3.Ext.define 方法非常适合定义您的类 - 类似于 Java 或其他 OO 语言。但是，这不是必需的，您可以简单地使用 Ext.create 方法来创建框架组件的实例并将其传递给自定义配置对象。 您还可以使用 Ext.define 创建您的基类，然后调用 Ext.create('MyBaseClass',{title:'mynew tile'}); 来获取您的基类的略微修改版本。

我鼓励您通读 MVC 和 Class system 上的 Sencha 指南，并查看他们的示例以更好地理解。

Answer 2

这些都是非常有效的观点。

首先，必须提到的是，您不必将 MVC 与 ExtJS 4 一起使用。您仍然可以在代码中使用 ExtJS 3 样式。

我假设如果您了解 MVC 的优点并决定采用它，那么是的 - 您将不得不扩展类并且有一些开销，但不可否认，您最终会得到一个更干净、更可重用的代码。不得不说，虽然您需要扩展顶级视图，但其中的项目仍然可以使用旧式编码。除此之外，在控制器的 init() 中，您可以修改某些视图配置（允许更少的类扩展，但更多的控制器代码）。

我必须承认，如果您有使用 ExtJS 3 的经验，并且正在迁移到 MVC 风格的应用程序，您最终会发现好处大于所涉及的工作。

就我个人而言，这是我第一次知道与商店有这种“业务”。所以我不能对此发表太多评论。

最后，一个正确编写的 ExtJs 4 应用程序，一个使用动态加载的应用程序应该比 ExtJS 3 应用程序加载得更快。您还可以编译仅包含应用程序中使用的代码的 Ext 版本。是的，您可以在需要时实例化控制器（及其视图和存储），这就像一个魅力：

loadPage: function(aControllerName)
{
    // save recent page in a cookie
    Ext.util.Cookies.set('RecentPage', aControllerName);

    // Dynamically load the controller
    var iController = this.getController(aControllerName);

    // Manually initialise it
    iController.init();

    // Load the page (by getting the first view of the controller).
    var iPage = this.getView(iController.views[0]).create();

    // Add the page to the content panel.
    var iContentPanel = this.getContentPanel();

    iContentPanel.removeAll(true);

    iContentPanel.add(iPage);

    iContentPanel.doLayout();
}