ExtJS提供的数据代理主要分为两大类:

1.客户端代理 (Ext.data.proxy.Client)

2.服务器代理(Ext.data.proxy.Server)

这两个类 都继承自 Ext.data.proxy.Proxy ,

客户端代理主要包括:Memory?? WebStorage?? SessionStorage?? LocalStorage

服务器端代理包括:? Ajax?? Rest? JsonP

Ext.data.proxy.Memory

    //this is the model we will be using in the store
              Ext.define('User', {
                  extend: 'Ext.data.Model',
                  fields: [
          { name: 'id', type: 'int' },
          { name: 'name', type: 'string' },
          { name: 'phone', type: 'string', mapping: 'phoneNumber' }
      ]
              });

              //this data does not line up to our model fields - the phone field is called phoneNumber
              var datas = {
                  users: [
          {
              id: 1,
              name: 'Ed Spencer',
              phoneNumber: '555 1234'
          },
          {
              id: 2,
              name: 'Abe Elias',
              phoneNumber: '666 1234'
          }
      ]
              };


              //创建memory代理
              var memProxy = new Ext.data.proxy.Memory({

                  model: 'User',
                  reader: { root: 'users' },
                  data: datas

              });
              //读取数据
              memProxy.read(new Ext.data.Operation(), function (result) {

                  var total = result.resultSet.total;
                  alert("数据总条数为:" + total);

              }) 

DOM Storage 分为两类, sessionStorage 和 localStorage

sessionStorage: 用于存储与 当前浏览器窗口关联的数据.窗口关闭后,sessionStorage中数据将无法使用

localStorage:????? 用于长期存储数据.窗口关闭,数据仍然可以访问, 所有浏览器窗口可以共享 数据.

?

下面看看一个 localStorage的例子

Ext.define('Search', {
                fields: ['id', 'query'],
                extend: 'Ext.data.Model',
                proxy: {
                    type: 'localstorage',
                    id: 'twitter-Searches'
                }
            });

            var store = new Ext.data.Store({
                model: "Search"
            });

            //添加数据
            store.add({ query: 'Sencha Touch' });
            store.add({ query: 'Ext JS' });
            //保存数据
            store.sync();

            //读取数据
            store.load();

            var msg = [];
            store.each(function (data) {
                msg.push(data.get('id') + '-' + data.get('query'));

            })
            alert(msg.join('\n'));

?当 关闭浏览器,从今浏览此页面后,效果图:

说明,localstorage 是长期存储数据的,即使关闭浏览器,数据仍然存在.

下面还要说明一点:LocalStorage代理如果没有指定id,则会使用 store的id,如果两个都没指点,那么就会抛出异常

?

?

Ext.data.proxy.SessionStorage

效果:

Ext.define('Search', {
?????????????? fields: ['id', 'query'],
?????????????? extend: 'Ext.data.Model',
?????????????? proxy: {
?????????????????? type: 'sessionstorage',
?????????????????? id: 'twitter-Searches'
?????????????? }
?????????? });

?????????? var store = new Ext.data.Store({
?????????????? model: "Search"
?????????? });

?????????? //添加数据
?????????? store.add({ query: 'Sencha Touch' });
?????????? store.add({ query: 'Ext JS' });
?????????? //保存数据
?????????? store.sync();