extjs 6.2 网格，从存储动态创建列

Question

在我的extjs 6.2项目中，我正在尝试从动态存储中为我的网格创建列。

我的网格是在视图页面上创建的

title: 'Data Viewer',
xtype: 'grid',
itemId: 'gridDataViewerId',
bind: {
store: '{storeData}'
},
ui: 'featuredpanel-framed',
cls: 'custom-grid',            
margin: '5',
//frame: false,
//forceFit: true,
//height: '100%',
flex: 1,
plugins: [{
ptype: 'gridexporter'
}]

加载存储后，我正在尝试创建列并填充数据，但它不起作用。 知道我做错了什么吗？

this.storeData.load({
url: x.util.GlobalVar.urlData_getData,
params: {
cid: cid,
email: localStorage.getItem('username'),
dateStart: targetStart,
dateEnd: targetEnd,
filename: targetFile
},
callback: function (response, opts) {
debugger;
var columnModel = me.storeData.data.items;                
me.myGrid.reconfigure(me.storeData, columnModel);
}
});

我认为我的问题是从我的商店创建列数组。 如果我尝试手动执行此操作，它可以工作...但我需要动态地做。

Answer 1

使用商店的metachange侦听器。像这样：

myStore.on('metachange', function(store, meta){
myGrid.reconfigure(store, meta.columns);
}

其中商店数据如下所示：

{
"records": [{
"id": 74474,
"name": "blah",
"age": 5
},{
"id": 74475,
"name": "asfdblah",
"age": 35
}],
"totalRecords": 2,
"metaData": {
"fields": [{
"name": "name"
},{
"name": "age",
"type": "number"
}],
"columns": [{
"text": "Name",
"dataIndex": "name",
"width": 150
},
{
"text": "Age",
"dataIndex": "age"
}],
},
"success": true
}