Javascript 如何显示不同的字段'；外部网格分组标题中的值？

我有一个Ext.grid.Panel，希望按字段分组，但在分组标题中显示不同的字段。例如，如果我的模型有

status\u id

和

status\u name

字段，我想按

status\u id

分组，但在组标题中显示

status\u name

---

我已经使用了

groupHeaderTpl

选项，但到目前为止运气不好。如何做到这一点？

您可以通过执行以下操作来调试grouperHeaderTpl值

groupHeaderTpl:'{[console.log(values)]}'

这样，您就可以观察所有可能的值，并选择正确的路径来获得您要查找的值。在这种情况下，您需要做的是

groupHeaderTpl: '{[values.rows[0].data.status_name]}'

在这里你可以找到整个例子

/* Sample Data */
var data = [ 
         { "status_id": 1, "status_name": "Pending"}, 
         { "status_id": 2, "status_name": "Ready"}, 
         { "status_id": 3, "status_name": "Processing"}, 
         { "status_id": 4, "status_name": "Unavailable"},
         { "status_id": 5, "status_name": "Ready"}, 
       ];

/* Model */
Ext.define("StatusModel", {
  extend: 'Ext.data.Model',
  fields: ['status_id', 'status_name']
});

/* Store */
Ext.create('Ext.data.Store', {
storeId:'statusStore',
model: "StatusModel",
groupField: 'status_id',
data: data,
proxy: {
    type: 'memory',
    reader: {
        type: 'json'
    }
}
});

/* Grouping Feature */
var groupingFeature = Ext.create('Ext.grid.feature.Grouping',{
   groupHeaderTpl: '{[values.rows[0].data.status_name]}'
});

/* Grid Panel */
Ext.create('Ext.grid.Panel', {
title: 'Status',
store: Ext.getStore('statusStore'),
columns: [
    { text: 'Id',     dataIndex: 'status_id' },
    { text: 'Name', dataIndex: 'status_name', flex: 1}
],
features: [groupingFeature],
renderTo: Ext.getBody()
});

---

不错的解决方案，尽管我认为我不应该以这种方式访问数据。