ExtJs Store注意事项

来源:互联网 发布:电脑软件管理 编辑:程序博客网 时间:2024/05/21 11:19

Store,即数据存储器, 主要用于提供给GridPanel,EditorGridPanel等关联数据用的。 

Store由Proxy(数据源)和DataReader(数据解析器)组成。 

Store包含多条Ext.data.record对象

换句话说: 
第一、数据存储器需要有数据才能叫数据存储器,而这个数据就是通过数据源获得; 
第二、获得数据后还需要通过数据解析器将这些数据进行解析,从而成为客户端认可的符合一定格式的数据。 
通过以上两个条件,这个数据存储器才能真正的为GridPanel等服务。 

现在来看一下Store是如何运作的: 
看API,我们只需要关心他的4个配置选项:data、proxy、reader、url 
以及他的1个方法:load 

1、如果配置了data,则proxy和url无效,且不需要调用load方法来生成Record集合 

2、如果没有配置data,则必须设置proxy或url,或两者都设置。此时,如果没有将autoLoad设置为true,那么需要手动进行load方法的调用。就是为了得到数组、Json或Xml格式的数据。 

3、reader是必须的,用以指定数据解析器,需要根据获得的数据格式指定相应类型的解析器。 

4、如果没有指定proxy,但指定了url,则会默认用HttpProxy作为数据源,并将url作为HttpProxy实例化时的参数。 

5、如果data封装的是数组格式的数据,则用ArrayReader作为解析器,也就是需要在Store实例化时,做如下的配置: 

Js代码  收藏代码
  1. reader:new Ext.data.ArrayReader({...});  


6、如果data封装的是json格式的数据,则用JsonReader作为解析器,也就是需要在Stroe实例化时,做如下的配置: 
Js代码  收藏代码
  1. reader:new Ext.data.JsonReader({...});  


7、如果data封装的是xml格式的数据,则用XmlReader作为解析器,也就是需要在Store实例化时,做如下的配置: 
Js代码  收藏代码
  1. reader:new Ext.data.XmlReader({...});  
8、如果store里面的数据修改了,可以通过store.commitChages()或record.commit()来修改数据,也可有恢复之前的数据store.rejectChages()或record.reject(),注意:是在没有提交的情况下才能恢复。

下面是一个Store的例子:注:store.baseParams={aa:'b'}

Ext.onReady(function(){var proxy=new Ext.data.HttpProxy({url: '/My_ExtJs/Login-query.action',method:'POST'});var myReader = new Ext.data.JsonReader({    idProperty: 'DEPTNO',    root: 'data',//对应后台的数据的key    totalProperty: 'total',//对应后台的属性总记录数,不是总页数    fields: [//也可以通过Ext.data.record.create来创建        {name: 'deptno', mapping: 'DEPTNO'},//mapping是从后台传输过来的JSON对象的值,        {name: 'dname', mapping: 'DNAME'},        {name: 'loc', mapping: 'LOC'}    ]});var store = new Ext.data.Store({proxy : proxy,      storeId: 'myStore',    reader:myReader});store.load({params:{start:0,limit:2},callback:function(r,ops,success){//当success=200的时候//store.each(function(record){//alert(record.get('deptno'));//});//var newRecord=new Ext.data.Record({name:"Tom",age:22}); //store.add(newRecord); //store.insert(3,newRecord);alert(store.getCount()+" "+store.getTotalCount());//alert(store.getAt(3).get('name'));//得到的是record.get('name')}});//alert(store.getCount());//当访问后台还没回来的时候已经跑完了,所以为0});

store.load()方法应放到grid之后来装载,才能触发loadmask。

配置HttpProxy中的api

Ext.data.Api.actions['read'] = 'load';

proxy : new Ext.data.HttpProxy({
// method : 'GET',
// url : path + '/servlet/My_Servlet'
api : {
'load' : {
'method' : 'POST',
url : path + '/servlet/My_Servlet'
}
}
})

store中修改record一条记录的话,

alert(myStore.getAt(0).get('mid'));

myStore.getAt(0).set('mid','ab');

alert(myStore.getModifiedRecords()[0].get('mid'));

转自:http://yahaitt.iteye.com/blog/234409





原创粉丝点击