ExtJs中关于grid和store的应用分析(二)

第二部分:Store的核心阐释

Store即数据存储器,主要用于提供给GridPanel,EditorGridPanel等关联数据用的。
Store由Proxy(数据源)和DataReader(数据解析器)组成。
换句话说:
第一、数据存储器需要有数据才能叫数据存储器,而这个数据就是通过数据源获得;
第二、获得数据后还需要通过数据解析器将这些数据进行解析,从而成为客户端认可的符合一定格式的数据。
通过以上两个条件,这个数据存储器才能真正的为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({...});  
reader:new Ext.data.ArrayReader({...});



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

Js代码 复制代码
  1. reader: new  Ext.data.JsonReader({...});  
reader:new Ext.data.JsonReader({...});



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

Js代码 复制代码
  1. reader: new  Ext.data.XmlReader({...});  
reader:new Ext.data.XmlReader({...});



通过以上5、6这两个解析器的特点,Store衍生了2个子类,分别是SimpleStore和JsonStore。
SimpleStore的内部使用ArrayReader解析器,即他的reader的值为ArrayReader的实例对象。
JsonStore的内部使用JsonReader解析器,即他的reader的值为JsonReader的实例对象。

对于第7条,可以如下应用:

Js代码 复制代码
  1. var  url =  "testxml.xml" ;   
  2. var  store =  new  Ext.data.Store({   
  3.   url:url, //指向xml文件   
  4.   proxy:proxy, //如果有了url,可以不用配置proxy   
  5.   reader: new  Ext.data.XmlReader({...}) //必须的选项   
  6. }); 
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值