在 gridPanel 上使用 autoHeight 属性以及分组功能时似乎存在缺陷。
当您将分组设置为 startCollapsed 时,网格的高度设置为折叠行的高度(这是正确的),但是当我展开组时,网格的高度不会更新,因此新内容会推送旧内容进入不可见区域。
您可以在 sensha 文档 http://docs.sencha.com/ext-js/4-0/#!/api/Ext.grid.Panel 上轻松复制该问题转到分组部分并粘贴以下代码:
var store = Ext.create('Ext.data.Store', {
storeId:'employeeStore',
fields:['name', 'senority', 'department'],
groupField: 'department',
data: {'employees':[
{ "name": "Michael Scott", "senority": 7, "department": "Manangement" },
{ "name": "Dwight Schrute", "senority": 2, "department": "Sales" },
{ "name": "Jim Halpert", "senority": 3, "department": "Sales" },
{ "name": "Kevin Malone", "senority": 4, "department": "Accounting" },
{ "name": "Angela Martin", "senority": 5, "department": "Accounting" }
]},
proxy: {
type: 'memory',
reader: {
type: 'json',
root: 'employees'
}
}
});
var groupingFeature = Ext.create('Ext.grid.feature.Grouping',{
startCollapsed: true
});
Ext.create('Ext.grid.Panel', {
title: 'Employees',
store: Ext.data.StoreManager.lookup('employeeStore'),
columns: [
{ header: 'Name', dataIndex: 'name' },
{ header: 'Senority', dataIndex: 'senority' }
],
features: [groupingFeature],
width: 200,
autoHeight: true,
renderTo: Ext.getBody()
});
我应该如何解决此问题并在展开或折叠项目时调整网格大小?
最佳答案
首先,网格(或任何组件)不支持 autoHeight
配置。
但该行为显然是一个错误,并且已在 Ext JS 4.1 中修复。
对于 4.0.7 中的解决方法,您可以显式强制布局在组展开/折叠时发生:
grid.getView().on({
"groupexpand": function() {
grid.doLayout();
},
"groupcollapse": function() {
grid.doLayout();
}
});
关于extjs - Ext JS GridPanel autoHeight 不适用于组展开折叠,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9730688/