Extjs 解决grid 列未占满整个表格

刚开始学习Extjs，使用到了GridPanel，用的是4.0

结果出现的结果是如图

在右边始终是不能让表格列占满整个表格，想着设置成固定的width又不好，得要根据内容填充。

网上找到一个是Extjs3.0的例子，使用autoExpandColumn

1. 1.Ext.onReady(function(){????
2. 2.????var?data?=?[????
3. 3.??????[1,"EasyJWeb","EasyJF","www.easyjf.com"],????
4. 4.??????[2,"Jfox","huihoo","www.huihoo.org"],????
5. 5.??????[3,"jdon","jdon","www.jdon.com"],248); line-height:18px"> 6.??????[4,"springside","springside","www.springside.org.cn"]????
6. 7.????];????
7. 8.????????
8. 9.????var?store?=?new?Ext.data.SimpleStore({????
9. 10.??????data:data,????
10. 11.??????fields:["id","name","organization","homepage"]????
11. 12.????});????
12. 13.????????
13. 14.????var?grid?=?new?Ext.grid.GridPanel({????
14. 15.??????renderTo:"hello",248); line-height:18px"> 16.??????title:"中国java开源产品及团队",108); list-style:decimal-leading-zero outside; color:inherit; line-height:18px"> 17.??????height:150,????
15. 18.??????width:560,108); list-style:decimal-leading-zero outside; color:inherit; line-height:18px"> 19.??????columns:[{header:"项目名称",dataIndex:"name"},248); line-height:18px"> 20.??????????{header:"开发团队",dataIndex:"organization"},108); list-style:decimal-leading-zero outside; color:inherit; line-height:18px"> 21.??????????{header:"网址",dataIndex:"homepage",renderer:showUrl}],248); line-height:18px"> 22.??????store:store,108); list-style:decimal-leading-zero outside; color:inherit; line-height:18px"> 23.??????//当使用ext2.2时，autoExpandColumn为0时没效果，为1时第2列扩展，为2时第3列扩展；????
16. 24.??????//当使用ext3.0时，autoExpandColumn为0时没效果，为1时第1列扩展，为2时第2列扩展，为3时第3列扩展????
17. 25.??????autoExpandColumn:3????
18. 26.????});????
19. 27.??});????
20. 28.??function?showUrl(value){????
21. 29.????return?"<a?href='http://"+value+"'?target='_blank'>"+value+"</a>";????
22. 30.??} ? ?

而Extjs4.0中使用的是flex，flex代表列宽占所有列的比例，自动填充

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!