extjs中的mapping 和 dataIndex

在extjs的项目开发中,有时候中弄不清record中的 mapping和columnModel中的dataIndex的区别,在这里做下备注

数据集  data:

var MyRecord = Ext.data.Record.create([
             {name: 'title'},
             {name: 'username', mapping: 'author'},
             {name: 'loginTimes', type: 'int'}
]);
 var myReader = new Ext.data.JsonReader({
      totalProperty: "results", 
      root: "rows",       
      id: "id" 
}, MyRecord);

这里的JsonReader可以解析下面的JSON数据

{ 'results': 2, 'rows': [
    { id: 1, title: '测试', author: '小王', loginTimes: 3 },
    { id: 2, title: 'Ben', author: 'williamraym', loginTimes:13} ]
}

在创建myRecord中  {name: 'username', mapping: 'author'} 中就用到了mapping,在数据中没有。record就会解析json数据中的  author 属性。

总结 mapping的作用是 reader解析数据的时候,与数据做匹配解析用的

dataIndex是column中列对应的数据集字段

    var cm = new Ext.grid.ColumnModel([
        {header:'编号',dataIndex:'id',sortable:true},
        {header:'名称',dataIndex:'name'},
        {header:'描述',dataIndex:'descn'}
    ]);

    var data = [
        ['1','name1','descn1'],
        ['2','name2','descn2'],
        ['3','name3','descn3'],
        ['4','name4','descn4'],
        ['5','name5','descn5']
    ];

    var store = new Ext.data.Store({
        proxy: new Ext.data.MemoryProxy(data),
        reader: new Ext.data.ArrayReader({}, [
            {name: 'id',mapping:1},
            {name: 'name',mapping:0},
            {name: 'descn',mapping:2}
        ])
    });
    store.load();

    var grid = new Ext.grid.GridPanel({
        autoHeight: true,
        renderTo: 'grid',
        store: store,
        cm: cm
    });

 dataIndex是在ColumnModel中。Mapping是在render中。dataIndex是关联columnMode和store中render的name。  mapping是关联 store和 data数据的

猜你喜欢

转载自421728862.iteye.com/blog/2323806
今日推荐