关于extjs4.2:ExtJs-具有通用页眉和页脚部分的页面设计

ExtJs - page design with common header and footer section

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

我的情况是这样的:

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

我所有的页面都具有相似的布局...即..west / center的内容仅在各个页面之间发生变化...所以我们有解决方案来简化此操作而无需在所有页面中定义整个布局...

请让我知道是否需要进一步说明

?Ragesh Ak


我想您将要使用Ext.define并扩展视口组件,使其具有边框布局。有关如何创建自定义组件的信息,请参见ExtJS教程。您将要给它一个边框布局,并为您的北部和南部对象提供静态面板/容器/菜单/工具栏。

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


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