扫二维码与项目经理沟通
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流
这篇文章将为大家详细讲解有关Ext.js中Proxy有什么用,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。
专注于为中小企业提供网站设计制作、做网站服务,电脑端+手机端+微信端的三站合一,更高效的管理,为中小企业绵阳免费做网站提供优质的服务。我们立足成都,凝聚了一批互联网行业人才,有力地推动了近1000家企业的稳健成长,帮助中小企业通过网站建设实现规模扩充和转变。一:描述
Proxy被Store用来加载和保存数据。Proxy的类型主要分为两大种客户端代理和服务端代理。
客户端代理:
1.LocalStorageProxy:在浏览器支持的情况下,存储数据到本地
2.SessionStorageProxy:在浏览器支持的情况下,存储数据到session
3.MemoryProxy:存储数据到本地内存,在页面刷新的时候,数据会丢失
服务端代理:
1.Ajax :在同一个域内,发送请求到服务端。
2.JsonP:在跨域的情况下,发送请求到服务端
3.Rest :使用RESTful HTTP请求
4.Direct :使用Ext.direct.Manager 发送请求。
二:Ext.data.proxy.Ajax
AjaxProxy是在应用中使用最广的一种代理方式,通过ajax请求服务端,加载数据。
如:
Ext.define('User', {
extend: 'Ext.data.Model',
fields: ['id', 'name', 'email']
});
var store = Ext.create('Ext.data.Store', {
model: 'User',
proxy: {
type: 'ajax',
url : 'users.json'
}
});
store.load();
这里我们加载User数据到Store,我们事先定义了一个Model,期望服务端返回对应字段的数据。
接下来我们通过proxy的配置,自动生成一个sotre
new Ext.data.proxy.Ajax({
url: 'users.json',
model: 'User',
reader: 'json'
});
1. Readers和Writers
AjaxProxy可以配置一个Reader去解析服务端返回的信息。如果没有设置Reader,AjaxProxy
默认使用一个JsonReader.
如:
var proxy = new Ext.data.proxy.Ajax({
model: 'User',
reader: {
type: 'xml',
root: 'users'
}
});
proxy.getReader(); //returns an XmlReader instance based on the config we supplied
2.Url generation
AjaxProxy自动插入排序,过滤,分页和分组选项到任何请求的url中,他通过以下参数来进行配置:
pageParam : 页码(也可以参考startParam和limitParam)
sortParam : 排序
groupParam : 分组
filterParam : 过滤
三:config
1.extraParams : 其它参数
2.limitParams : 默认为limit
3.noCache : 是否缓存请求 ,默认为true
4.pageParam : 默认为page
5.reader : Ext.data.reader.Reader
用来解析数据到一个Model或一个Store.
如:
Ext.create('Ext.data.Store', {
model: 'User',
proxy: {
type: 'ajax',
url : 'users.json',
reader: {
type: 'json',
root: 'users'
}
},
});
Json字符串为:
{
"success": true,
"users": [
{ "name": "User 1" },
{ "name": "User 2" }
]
}
6.url
7.actionMethods
默认值:create: 'POST', read: 'GET', update: 'POST', destroy: 'POST'
四:Store & AjaxProxy举例
var store = Ext.create('MyDesktop.ext.TimeoutController', {
fields : ['roleId', 'roleName', 'status'],
proxy : {
type : 'ajax',
actionMethods : {
read : 'POST'
},
pageParam : 'pageNo',
limitParam : 'pageSize',
url : '../role/findFuncRoles.do',
reader : {
type : 'json',
root : 'funcRoles',
totalProperty : 'totalCount'
}
}
});
关于“Ext.js中Proxy有什么用”这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,使各位可以学到更多知识,如果觉得文章不错,请把它分享出去让更多的人看到。
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流