经常会有人问我为什么我的Grid不能岁窗口的变得而自动调整了解后发现很多人都习惯在渲染子组件的时候将Gird渲染到容器内的一个div里而这正是问题的所在
在Ext JS的布局系统中能控制到的是容器的子组件而对于渲染到容器中一个DIV的Grid它并不知道在这容器里添加了一个Grid当调整大小的时候也就无法去调整Grid的大小了而这也就是为什么Grid不会随容器的改变而改变了
为什么那么多人喜欢使用这种方式来添加子组件呢?我想原因主要有以下两点
不知道如何在容器内添加子组件
习惯了使用JQuery等其他框架的开发方法一时无法改变
第一个原因只要是动态添加Grid搞到很多初学者束手无策譬如我的Grid要从远程返回后才知道怎么创建我怎么去拿这个脚本和添加到容器呢?笔者在学习Ext JS也犯过这样的错误可以理解所以本文的作用就是来解惑的
办法有两个一是使用Ajax把整个Grid(或其他组件的配置对象)加载到本地然后使用容器的add方法就可以将组件添加到容器一是直接使用容器的load功能直接加载子组件并渲染返回的数据就是子组件的配置对象
第二个原因是习惯问题只能自己去修正了尽快熟悉Ext JS的开发模式就可以很容易改掉这个习惯
如果是使用Ext JS 的MVC做开发基本不会出现这么尴尬的情况了因而可以将子组件做成视图然后在控制器中将视图添加到容器中就可以了