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实例化时，做如下的配置:

reader:new Ext.data.ArrayReader({...});

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

reader:new Ext.data.JsonReader({...});

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

reader:new Ext.data.XmlReader({...});

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

对于第7条，可以如下应用：

var url = "testxml.xml";
var store = new Ext.data.Store({
  url:url,//指向xml文件
  proxy:proxy,//如果有了url，可以不用配置proxy
  reader:new Ext.data.XmlReader({...})//必须的选项
});

评论

1 楼 slysuccess 2014-01-25  

讲解的非常好！以前还不是太明白，现在终于明白了！谢谢博主