煎茶的Ext JS ArrayStore网格空

Question

早安，

我是全新的，以煎茶EXT JS，像literately这是我的第一天。我创建了一个小型应用程序，在面板中创建一个Grid，然后用ArrayStore（硬编码）的一些数据填充网格。该应用程序运行良好，但我在网格中获得三个空条目并且没有数据。有任何想法吗？

Ext.application({ 
name : 'MyApp', 

launch : function() { 

Ext.onReady(function() { 
    var store = new Ext.data.ArrayStore({ idProperty: 'storeTest', autoDestroy: true, storeId: 'myStore',idIndex: 0, fields: [{name: 'name', type: 'string'},{name: 'age', type: 'int'},]}); 

    var myData = [ 
     ['Person1',31], 
     ['Person2',30], 
     ['Person3',6] 
    ]; 

    store.loadData(myData); 

    var resultsPanel = Ext.create('Ext.panel.Panel', { 
     title: 'Results', 
     width: 1000, 
     height: 400, 
     renderTo: Ext.getBody(), 
     layout: { type: 'hbox', align: 'stretch', padding: 5 }, 
     items: [{ xtype: 'grid', columns: [{header: 'Name'}, { header: 'Age' }], store: store, flex: 1 }, 
     { xtype: 'splitter' }, 
     { title: 'Details', bodyPadding: 5, items: [{ fieldLabel: 'Data item', xtype: 'textfield'}], flex: 2 }] 
    }); 
}); 
} 

}）;

Answer 1

你缺少对每个列的dataIndex属性：

[{ xtype: 'grid', columns: [{header: 'Name',dataIndex: 'name'}, { header: 'Age',dataIndex: 'age' }], store: store, flex: 1 },