ExtJs - 具有通用页眉和页脚部分的页面设计

Question

我目前正在使用 ExtJs 4.2 来开发我的网页。我想知道我们是否可以定义一个模板并可以跨页面重用模板。更清楚一点，页面页眉和页脚在页面之间保持不变，只有正文组件发生变化。 我的意思是类似于 jsp 中的瓷砖。

我的场景是这样的：

我定义了一个边框布局，其中 region="north" 包含页眉部分，region="south" 包含页脚部分，而 region="west" 和 region="center" 包含正文内容。

我所有的页面都有类似的布局...即..west/center 的内容仅在页面之间发生变化...所以我们有解决方案来简化这一点，而无需在所有页面中定义整个布局...

如果需要进一步说明，请告诉我

~拉格什阿克

Answer 1

我想你会想要使用 Ext.define，并扩展视口组件，给它一个边框布局。请参阅creating custom components 上的 ExtJS 教程了解如何执行此操作。你会想要给它一个边框布局，并为你的北方和南方对象提供静态面板/容器/菜单/工具栏。

如何为内容/中心和导航/西部组件建模取决于您正在构建的应用程序的风格。如果您使用 ExtJS 使用 Ext.app.Application 为您提供的 Model/Store/View/Controller 模式遵循单页应用程序概念，那么您将需要在这些插槽中放置空容器，因为您无法换出边框布局组件。放入空容器将允许您调用 removeAll 函数，然后在更改视图时添加新项目。如果您正在构建一个在您在视图之间移动时重新加载页面的常规网站，您可以扩展您创建的视口，并将您的内容直接放入视口，因为它永远不需要更改。

Answer 2

使用define 配置一个扩展container 并具有您刚才描述的边框布局的类，因此您可以根据需要重用这个新类。