在ext js app中注入额外的mvc逻辑

时间:2012-12-26 11:40:17

标签: javascript extjs

我是ext js的新手,但是通过入门指南并设法创建了我自己的应用程序。

现在我正在为电子商务系统(shopware)构建一个插件,需要动态扩展应用程序。

我设法通过猴子修补现有控制器来添加视图:

//{extends file="[default]backend/article/controller/main.js"}
//{namespace name=backend/article/view/main}
//{block name="backend/article/controller/main" append}
Ext.define('Shopware.apps.Article.controller.MyApp', {
    override: 'Shopware.apps.Article.controller.Main',
    openMainWindow: function() {
        var me         = this,
            mainwindow = me.callOverridden();    
            oldTabCreation  = mainwindow.createMainTabPanel;
            mainwindow.createMainTabPanel = function() {
                  mainTab = oldTabCreation.apply(this);
                  mainTab.add(
                      Ext.create('Ext.panel.Panel',
                          {
                                title: 'Pricify',
                                layout: 'card'
                          })
                  );
                  return mainTab;
            };
        return mainwindow;
    }
});
//{/block}

这很有效。我不确定,如果这是首选的方式,但View会在正确的位置加载,我很高兴(因为它花了我几个小时)。

但还有一段路要走。

我如何在这里注入整个逻辑?

我的要求是:

  • 我需要一个控制器,一个视图和一个商店/模型
  • 最好在自己的命名空间中
  • 我想将我的班级分成文件。
  • 该文件必须位于插件文件夹中,而不是原始应用程序文件夹中。

我可以将代码附加到app.js文件中,但据我所知,我无法附加控制器和视图,也不知道如何自动加载文件。

有没有首选方式?

修改 我现在正在构建一个简单的应用程序,之前已加载并尝试注入随后可用于应用程序的控制器。一旦我准备好,我会报告回来。

1 个答案:

答案 0 :(得分:1)

通常我会通过截取控制器事件(使用Ext.ux.Application覆盖)并在其上添加一些逻辑来执行此类操作。或者,如果可行,您可以扩展现有控制器并将其替换为整个应用程序中的自定义控制器。否则,猴子补丁可能是扩展现有单一应用程序的唯一方法,而这种应用程序并未考虑可扩展性。

此外,4.2 Beta 2应该很快就会出现;它包括一系列MVC改进,包括类似上面提到的覆盖。你可能想看看它。