首页 / 脚本样式 / ExtJS / ExtJs viewport & 可复用框架

ExtJs viewport & 可复用框架2010-12-12 博客园 joyyuan97在项目里面使用ExtJs viewport定义页面框架时，各页面的框架基本相同， 只有对各页面内部会有少许不同。此文介绍我在使用ExtJs的viewport时，采用 的方法。

步骤一：在公共文件ExtCustomer.js中定义区域对象

1var viewport;
2
3var leftPanel = {
4 region: "west",
5 id: "west-panel",
6 contentEl: "LeftDiv",
7 autoScroll: true,
8 margins: "0 0 0 0",
9 width: 200
10}
11
12var topPanel = {
13 region: "north",
14 id: "north-panel",
15 contentEl: "TopDiv",
16 height: 75,
17 margins: "0 0 0 0"
18};
19
20var bottomPanel = {
21 region: "south",
22 id: "south-panel",
23 contentEl: "BottomDiv",
24 height: 20,
25 margins: "0 0 0 0"
26};
27
28var contentPanel = {
29 region: "center",
30 id: "center- panel",
31 contentEl: "ContentDiv",
32 layout: "fit",
33 margins: "0 0 0 0",
34 border: false
35};

上面代码中定义了四个区 域：页头，页脚，左侧和内容。