Extjs 中的多个视口答案

【问题标题】：Multiple Viewports in ExtjsExtjs 中的多个视口
【发布时间】：2012-06-28 04:11:36
【问题描述】：

我有 100 个不同的 url，每个都指向纯 html 页面，我必须将这些纯 html 页面转换为 extjs 页面。所有页面的页脚和页眉都相同，但不同的纯 html 页面的中心部分不同。为了利用最大的代码，我想创建一个 EXTJS4.1.0 应用程序，它具有模型、视图、存储和控制器，但单独的 index.html、app.js 和 viewport.js。分开 index.html、app.js 和 viewport.js 的原因是，如果我不保留单个 index.html、app.js 和 viewport.js，那么我将无法为页面添加书签（因为用户和使用100 个不同页面的 100 个不同 url）所以基本上我将有 100 个不同的 app.js 和相应的 viewport.js（viewport.js 将具有用于页脚/页眉等的通用组件和用于屏幕的特定组件）但在某个时间点只有一个index.html、app.js 和 viewport.js 将被激活/运行。

我的第一个问题是，我刚才提到的解决方案是正确的解决方案吗？

在 Extjs MVC 模式中，如果使用 autoCreateViewport: true，每个应用程序只能有一个 Viewport.js 文件是真的吗？

其次，如果您在 Ext.Application 中（在 app.js 中）使用 autoCreateViewport: false 并在启动方法中创建不同 Viweport 的实例，如下所示：

Ext.application({
    name: 'Panda',
    autoCreateViewport: false,
    launch: function() {
        Ext.create('Panda.viewport.ViewportOne')
    }
});

请注意，我创建了 ViewportOne 的实例，它是 100 个视口之一。使用此解决方案，我在运行应用程序时也遇到了故障（某些导航不起作用等）。是不是因为 extjs 不允许使用 Panda.viewport.ViewportOne、Panda.viewport.ViewportTwo 等名称的视口？

如何在 Extjs 中创建带有书签页面的完全 MVC 风格的应用程序，这样每个页面都是同一个 extjs 应用程序的一部分（即它利用相同的模型视图、存储、控制器和动态加载）。

【问题讨论】：

天啊，为什么你真的需要转换它们？只需使用 iframe / ajax 请求。
您为什么不告诉我们您的实际目标，以便我们帮助您防止做一些非常愚蠢的事情？

标签： model-view-controller extjs viewport

【解决方案1】：

我工作的公司有很多客户正在使用基于纯 html 和 javascript 构建的应用程序。每个用户只在该应用程序的一个页面上工作，他已在浏览器上添加了书签。我的任务是将那些普通的 html/javascript 页面升级到 Extjs 页面，这样用户就不必更新他们的书签了。

最后，我正在考虑在 Extjs 4.1.0 中创建单个应用程序，该应用程序将有 100 个页面（用户将添加书签的 index.html、indexOne.html 等），每个页面是否可以使用常见的模型/视图/存储和控制器.

所以基本上我的应用程序入口点会有所不同，但所有页面都将使用相同的模型/视图/存储/控制器。它更像是一个架构问题。

希望对您有所帮助。

【讨论】：