ExtJS客户端代理
代理(proxy)分为两大类:客户端代理和服务器端代理。客户端代理主要完成与浏览器本地存取数据相关的工作,服务器端代理则是通过发送请求,从服务器端获取数据。根据各自获取数据的方式,客户端代理和服务器端代理又可以分为一下几种:
客户端代理:
- LocalStorageProxy:将数据存储在localStorage中,此种方式可以持久的将数据存储在客户端。
- SessionStorageProxy:将数据存储在sessionStorage中,此种方式只在当前会话中生效,当关闭浏览器以后,数据也会随之丢失。
- MemoryProxy:将数据存储在内存中,此种方式只在当前页面有效,且如果刷新页面,数据将丢失。
服务器端代理:
- Ajax:在当前域中发送请求
- JsonP:跨域的请求
- Rest:与服务器进行RESTful(GET/PUT/POST/DELETE)交互
- Direct:使用 Ext.direct.Manager 发送请求
SessionStorageProxy 的用法与LocalStorageProxy 的用法基本一致。例如以下代码演示LocalStorageProxy 的用法:
// 首先,我们定义一个简单的Person类
Ext.define('Person', {
extend: 'Ext.data.Model',
fields: ['name', 'age']
}); // 紧接着,我们还需要一个Store。我们可以把 Store 理解为数据仓库,它对应数据库中的表,而Store 包含的 Record 则是数据表中的每一行记录。实际使用中我们更多的对store进行操作。
var personStore = Ext.create("Ext.data.Store", {
model: 'Person'
}); // 接下来就到我们代理出场的时候了。我们需要创建一个LocalStorageProxy:
var personProxy = new Ext.data.proxy.LocalStorage({
id: 'Person_LocalStorage', // 建立关联后,针对model,和不同的proxy区分开
model: 'Person'
}); // 建立代理与 Store 的联系
personStore.setProxy(personProxy); // 此时我们可以针对store进行增删改查(CRUD)的操作了
personStore.add({ name: 'www.qeefee.com', age: 1 });
personStore.add({ name: 'qf', age: 26 });
personStore.add({ name: 'qifei', age: 26 });
personStore.sync(); // 保存Search到本地数据库
此外,我们也可以在声明数据模型的时候,同时声明代理:
// 定义数据模型,在Model中加入代理配置以后,我们就不需要单独的定义代理对象了,可以直接使用Store来对其进行操作
Ext.define('Person', {
extend: 'Ext.data.Model',
fields: ['name', 'age'],
proxy: {
type: 'sessionstorage',
id: 'myProxyKey'
}
}); //定义Store
var personStore = Ext.create("Ext.data.Store", {
model: 'Person'
}); //添加数据
personStore.add({ name: 'www.qeefee.com', age: 1 });
personStore.add({ name: 'qf', age: 26 });
personStore.add({ name: 'qifei', age: 26 });
personStore.sync();
MemoryProxy与SessionStorageProxy 的用法和LocalStorageProxy 的用法相比略有差异。MemoryProxy 是将数据存储在内存中的,它只在当前页生效,如果关闭或刷新页面,所有数据都将丢失。在使用MemoryProxy 的时候,我们需要为Store指定一个数据集(类似于缓存),store 将通过代理对这个数据集进行操作:
//定义数据模型
Ext.define('Person', {
extend: 'Ext.data.Model',
fields: ['name', 'age']
});
var data = {
Users: [
{ name: 'www.qeefee.com', age: 1 },
{ name: 'qeefee', age: 1 }
]
}
//定义Store
var personStore = Ext.create("Ext.data.Store", {
model: 'Person',
data: data.Users,
proxy: {
type: 'memory'
}
});
当personStore 定义的时候,data中预先定义的缓存就会自动的将数据加载到Store中,所以在我们访问数据的时候不需要再调用load方法了:
//读取数据
var msg = [];
personStore.each(function (person) {
msg.push(person.get('name') + ' ' + person.get('age'));
});
Ext.MessageBox.alert('提示', msg.join('<br />'));
和上两个的操作基本一致,我们可以通过下面的代码添加一行新数据:
personStore.add({ name: 'qifei', age: 26 });
personStore.sync();
ExtJS客户端代理的更多相关文章
- ExtJS 4.2 教程-05:客户端代理(proxy)
转载自起飞网,原文地址:http://www.qeefee.com/extjs-course-5-client-proxy ExtJS 4.2 教程-01:Hello ExtJS ExtJS 4.2 ...
- Extjs 数据代理
Ext.data.proxy.Proxy 代理类的根类 客户端代理: 1.LocalStorageProxy:将数据存储在localStorage中,此种方式可以持久的将数据存储在客户端 要使用代理, ...
- Atitit 动态调用webservice与客户端代理方式调用
Atitit 动态调用webservice与客户端代理方式调用 方式1: 使用call.invoke 直接调用WSDL,缺点:麻烦,不推荐--特别是JAVA调用.NET的WS时,会有不少的问题需要解 ...
- 终于解决:升级至.NET 4.6.1后VS2015生成WCF客户端代理类的问题
在Visual Studio 2015中将一个包含WCF引用的项目的targetFramework从4.5改为4.6.1的时候,VS2015会重新生成WCF客户端代理类.如果WCF引用配置中选中了&q ...
- wcf生成客户端代理类步骤及语句
通过svcutil.exe工具生成客户端代理类和客户端的配置文件 .在运行中输入cmd打开命令行 ()cd C:\Program Files (x86)\Microsoft SDKs\Windows\ ...
- SCCM2012 R2实战系列之六:安装客户端代理软件
在安装客户端代理软件之前,请大家确保已经对本系列的第四和第五部分有了基本了解,而且对SCCM环境做了初始化配置和发现方法.我们目前讨论的是加域的计算机,对于工作组的计算机还需要进行额外的配置.在上篇文 ...
- WCF生成客户端代理对象的两种方法的解释
最近在封装WCF,有一些很好的实践就记录下来,大家可以放心使用,所有代码都已经调试过.如果有高手可以大家探讨一下. 在WCF中有两种不同的方法可以用于创建客户端服务对象,他们分别为: 1. 代理构造法 ...
- linux搭建代理服务器+蚁剑配置客户端代理
一:linux搭建代理服务器 0x00 介绍 关于搭建代理服务器的方法,我也是刚刚接触,从网上找了一些能够行得通的方法来给大家做个分享: 这里我用的是Tinyproxy作为代理服务软件.这个东西很小, ...
- ExtJs服务器端代理(Ajax)
服务器端代理: Ajax:在当前域中发送请求 JsonP:跨域的请求 Rest:与服务器进行RESTful(GET/PUT/POST/DELETE)交互 Direct:使用 Ext.direct.M ...
随机推荐
- 网站设置404页面 --nginx
有的时候根据域名要先知道用的什么web 服务器 最简单的 http://tool.chinaz.com/pagestatus/ 输入域名,看返回的头部信息 用的那个web浏览器 下面的方法也是根据头 ...
- session
小结
- VBA笔记(三)——常用对象
VBA实际上就是操作Excel,把Excel进行拆解,划分多层对象,由顶至下为(也可以说是层层包裹): Application:代表Excel程序本性,之后我们操作对象都在它之下,因为是唯一且至高点, ...
- Java程序员笔试、面试题目
1. 面向对象编程的三大特性是什么,请简要阐述 2. String 和StringBuffer的区别 3. 说出ArrayList,Vector, LinkedList的存储性能和特性 4. Coll ...
- 关于java的格式输出控制
java中的System.out.println()功能十分强大,可以对任意类型的数据进行输出. 这里我们不讨论System.out.println(),而是讨论System.out.printf() ...
- CentOS 下使用yum安装nodejs
在xenserver虚拟机器上安装nodejs 尝试失败方法, 1.比如解压编译好的文件,使用ln设置全局变量,因为解压出来没有bin目录无法使用 ln -s /home/kun/mysofltwar ...
- nodejs express下使用redis管理session
Session实现原理 实现请求身份验证的方式很多,其中一种广泛接受的方式是使用服务器端产生的Session ID结合浏览器的Cookie实现对Session的管理,一般来说包括以下4个步骤: 服务器 ...
- height:100%与height:inherit的区别
一.兼容性 首先,inherit这个属性只是在ie8+才支持:100%支持ie6: 二.大多数情况下没有区别 在正常情况下height:100%与height:inherit没有任何区别: 1.父元素 ...
- _WIN32_WINNT not defined. Defaulting to _WIN32_WINNT_MAXVER (see WinSDKVer.h)
原文地址::http://blog.csdn.net/xiaolongwang2010/article/details/7550505 相关网帖 1.错误找不到WinsdkVer.h----http: ...
- CROSS APPLY应用实例
--功能说明:统计每个人的平均分数,新字段[AVG_Score]根据PersonID链接到原表[tbiz_AssScore]上 SELECT [ID] ,[ProjectID] ,[PersonID] ...