EXT.data.Store用法详解

一:简单的store-SimpleStore

    使用实例：

     

var data = [
              ['value1','text1'],
              ['value2','text2']
          ];
var store = new Ext.data.SimpleStore({
        fileds:['value','text'],
        data:data   
});

 SimpleStore为在本地创建数据的简单获取数据集，fileds属性是定义获取数据的列名称，data则是获取本地数据集合，然后SimpleStore对其进行封装。

 

一:复杂的store-JsonStore

     例如：

//定义store
var chartStore = new Ext.data.JsonStore({
      root:'data',
      fields:[
        {
          name:'label',
          mapping:'endTime',
          convert:function(v,record){
            return Date.parseDate(v, 'Y-m-d H:i:s').format('H:i');
          }
        },
        {name:'startTime',type:'date',dateFormat:'Y-m-d H:i:s'},
        {name:'endTime',type:'date',dateFormat:'Y-m-d H:i:s'},
        {name:'alarmCount',type:'int'},
        {name:'eventCount',type:'int'}
      ],
      sortInfo:{field: 'startTime', direction: 'ASC'}
    });

//测试数据
var obj={
        startTime:'2009-06-22 01:00:00',
        endTime:'2009-06-23 01:00:00',
        interval:60,
        data:[
          {startTime:'2009-06-22 01:00:00',endTime:'2009-06-22 02:00:00',alarmCount:02,eventCount:15},
          {startTime:'2009-06-22 02:00:00',endTime:'2009-06-22 03:00:00',alarmCount:03,eventCount:0},
          {startTime:'2009-06-22 03:00:00',endTime:'2009-06-22 04:00:00',alarmCount:04,eventCount:15},
          {startTime:'2009-06-22 04:00:00',endTime:'2009-06-22 05:00:00',alarmCount:15,eventCount:25},
          {startTime:'2009-06-22 05:00:00',endTime:'2009-06-22 06:00:00',alarmCount:06,eventCount:15},
          {startTime:'2009-06-22 06:00:00',endTime:'2009-06-22 07:00:00',alarmCount:0,eventCount:20},
          {startTime:'2009-06-22 07:00:00',endTime:'2009-06-22 08:00:00',alarmCount:0,eventCount:0},
          {startTime:'2009-06-22 08:00:00',endTime:'2009-06-22 09:00:00',alarmCount:09,eventCount:15},
          {startTime:'2009-06-22 09:00:00',endTime:'2009-06-22 10:00:00',alarmCount:10,eventCount:15},
          {startTime:'2009-06-22 10:00:00',endTime:'2009-06-22 11:00:00',alarmCount:11,eventCount:25},
          {startTime:'2009-06-22 11:00:00',endTime:'2009-06-22 12:00:00',alarmCount:12,eventCount:75},
          {startTime:'2009-06-22 12:00:00',endTime:'2009-06-22 13:00:00',alarmCount:13,eventCount:12},
          {startTime:'2009-06-22 13:00:00',endTime:'2009-06-22 14:00:00',alarmCount:14,eventCount:10},
          {startTime:'2009-06-22 14:00:00',endTime:'2009-06-22 15:00:00',alarmCount:45,eventCount:60},
          {startTime:'2009-06-22 15:00:00',endTime:'2009-06-22 16:00:00',alarmCount:16,eventCount:25},
          {startTime:'2009-06-22 16:00:00',endTime:'2009-06-22 17:00:00',alarmCount:17,eventCount:8},
          {startTime:'2009-06-22 17:00:00',endTime:'2009-06-22 18:00:00',alarmCount:18,eventCount:47},
          {startTime:'2009-06-22 18:00:00',endTime:'2009-06-22 19:00:00',alarmCount:29,eventCount:35},
          {startTime:'2009-06-22 19:00:00',endTime:'2009-06-22 20:00:00',alarmCount:20,eventCount:15},
          {startTime:'2009-06-22 20:00:00',endTime:'2009-06-22 21:00:00',alarmCount:21,eventCount:10},
          {startTime:'2009-06-22 21:00:00',endTime:'2009-06-22 22:00:00',alarmCount:22,eventCount:5},
          {startTime:'2009-06-22 22:00:00',endTime:'2009-06-22 23:00:00',alarmCount:53,eventCount:15},
          {startTime:'2009-06-22 23:00:00',endTime:'2009-06-23 00:00:00',alarmCount:24,eventCount:33},
          {startTime:'2009-06-23 00:00:00',endTime:'2009-06-23 01:00:00',alarmCount:11,eventCount:0}
        ]
      }

//载入数据
chartStore.loadData(obj);

属性： 

root:获该属性是指包含所有行对象的数组，此处为obj中的data。

  fields:就是一个Record构造器，我们可以通过fields获取需要的字段，并对每个字段进行格式定义、转换等方法。['','',{},{}].

     1.定义列名称：简单写法为fields:['startTime']映射了Record的'startTime'字段为行对象的同名键名称。复杂点写法就是{name:'startTime'}

     2.映射：{name:'label',mapping:'endTime'}映射了'label'字段为行对象的'endTime'键。

     3.convert:默认的是function(v,record){}这个写法，是对数据中的这个字段进行格式转换。

     4.可对每个字段定义类型Type和格式定义。
  URL：指向外部的页面获取数据，需要接受回来的是jsonstore,创建一个    HttpProxy对象。

  sortInfo:如何排序的对象，格式如下：{field: "fieldName", direction: "ASC|DESC"}

方法：

load:

    采用配置好的Reader格式去加载Record缓存,store.load();

loadData:从传入的数据块中装载数据，并触发load事件.chartStore.loadData(obj);