Json数据未显示在extjs网格中

Question

给出表格中的数据：

var grid_data = [ {Hello: 'World'}, {Jesus:'Navas'} ]

我希望画一个这样的网格：

网格显示有2行但没有数据，我在下面的代码中找不到问题：

    var grid_store = Ext.create('Ext.data.Store', {
    fields: [
       {name: 'Property'},
       {name: 'Value'}
    ],
    data: grid_data
});

    // create the Grid
var grid_view = Ext.create('Ext.grid.Panel', {
    store: grid_store,
    renderTo: 'info_panel',
    stateful: true,
    stateId: 'stateGrid',
    columns: [
        {
            text     : 'Property',
            width    : 100,
            sortable : true,
            dataIndex: 'Property'
        },
        {
            text     : 'Value',
            width    : 80,
            sortable : false,
            dataIndex: 'Value'
        }
          ],
    height: 350,
    width: 600,
    title: 'Array Grid',
    viewConfig: {
        stripeRows: true
    }
});

呈现给：

<div id="info_panel"></div>

如果您想知道我是如何获得示例图像的，我将存储更改为ArrayStore并将数据重新格式化为数组，但我更倾向于错过该步骤并按原样插入数据。 / p>

编辑：

我认为我真正要求的是一种提醒extjs使用JSON键作为值的方法，而不是采用以下格式的大多数网格示例：

{value: 'Hello'}, {property: 'World'}

Answer 1

作为评论者之一和您的编辑建议，您的网格构建为使用带有“属性”的json和“值”作为json对象的键。我不知道您是否可以更改要在重新格式化的json中发送的数据源，但如果没有，您可以在收到数据后立即执行快速循环：

var new_data = [];
Ext.each(grid_data, function(obj) {
  for (var prop in obj) {
    new_data.push({
      Property: prop,
      Value: obj[prop]
    });
  }
}, this);