代码如下:
Ext.onReady(function(){ //定义列 var cm = new Ext.grid.ColumnModel([ {header: \'编号\', dataIndex: \'id\'}, {header: \'名称\', dataIndex: \'name\'}, {header: \'描述\', dataIndex: \'des\'} ]); //数据定义 var data = [ [\'1001\',\'name1\',\'description1\'], [\'1002\',\'name1\',\'description1\'], [\'1003\',\'name1\',\'description1\'], [\'1004\',\'name1\',\'description1\'], [\'1005\',\'name1\',\'description1\'] ]; //数据源定义 var store = new Ext.data.Store({ proxy: new Ext.data.MemoryProxy(data), reader: new Ext.data.ArrayReader({},[ {name: \'id\'}, {name: \'name\'}, {name: \'des\'} ]) }); store.load(); //grid panel var grid = new Ext.grid.GridPanel({ renderTo: Ext.getBody(), store: store, cm: cm }); });
google了一下:In Extjs 4.0 ,there is no colModel config for GridPanel(http://www.sencha.com/forum/showthread.php?199720-Ext.grid.ColumnModel-is-not-a-constructor)然后查看其API:其用法如下
Ext.onReady(function(){ Ext.create(\'Ext.data.Store\', { storeId: \'simpleStore\', fields: [\'name\', \'email\', \'phone\'], data:{ \'items\':[ {\'name\':\'yanshiying\', \'email\':\'email\', \'phone\':\'1234567890\'}, {\'name\':\'yanshiying\', \'email\':\'email\', \'phone\':\'1234567890\'}, {\'name\':\'yanshiying\', \'email\':\'email\', \'phone\':\'1234567890\'} ] }, proxy: { type: \'memory\', reader: { type: \'json\', root: \'items\' } } }); Ext.create(\'Ext.grid.Panel\', { title: \'Simple\', store: Ext.data.StoreManager.lookup(\'simpleStore\'), columns: [ {header: \'Name\', dataIndex: \'name\'}, {header: \'Email\', dataIndex: \'email\'}, {header: \'Phone\', dataIndex: \'phone\'} ], height: 200, width: 400, renderTo: Ext.getBody() }); })
运行效果: