使用JsonStore的ExtJS 4面板网格不加载网格

Question

我使用的是ExtJS 4.0.7，我正在使用JSON Store将它加载到面板网格。我使用的是Firefox 16.0.2版。这是一个非常简单的例子，我可以运行Array网格。

Ext.onReady(function() { 


var Grid1Store = new Ext.data.JsonStore({ 
    root: 'users', 
    fields: [ 'id', 'name', 'email' ], 
    autoLoad: true, 
    data: { users: [ 
     { "id": 1, "name":"John Smith", "email":"jsmith@example.com"}, 
     { "id": 2, "name":"Anna Smith", "email":"asmith@example.com"}, 
     { "id": 3, "name":"Peter Smith", "email":"psmith@example.com"}, 
     { "id": 4, "name":"Tom Smith", "email":"tsmith@example.com"}, 
     { "id": 5, "name":"Andy Smith", "email":"asmith@example.com"}, 
     { "id": 6, "name":"Nick Smith", "email":"nsmith@example.com"} 
    ]} 
    }); 


var Grid1Grid = new Ext.grid.GridPanel({ 
     store: Grid1Store, 
     renderTo: 'grid-example', 
     title: 'Target', 
     width: 300, 
    columns: [ 
     { 
     id: 'name', 
     header: "Name", 
     sortable: true, 
     dataIndex: 'name' 
     },{ 
     id: 'email', 
     header: "Email", 
     sortable: true, 
     dataIndex: 'email' 
     } 
    ] 

}); 

}); 

表格正在加载并且没有数据显示。它显示一个空格。我不确定这个问题。是否由于某些浏览器兼容性问题？

Answer 1

你的店铺是本地的。请勿使用根属性

var Grid1Store = new Ext.data.JsonStore({ 
    fields: [ 'id', 'name', 'email' ], 
    autoLoad: true, 
    data: [ 
    { "id": 1, "name":"John Smith", "email":"jsmith@example.com"}, 
    { "id": 2, "name":"Anna Smith", "email":"asmith@example.com"}, 
    { "id": 3, "name":"Peter Smith", "email":"psmith@example.com"}, 
    { "id": 4, "name":"Tom Smith", "email":"tsmith@example.com"}, 
    { "id": 5, "name":"Andy Smith", "email":"asmith@example.com"}, 
    { "id": 6, "name":"Nick Smith", "email":"nsmith@example.com"} 
    ] 
});