zoukankan      html  css  js  c++  java
  • ExtJs4之Proxy数据代理

    Proxy数据代理是进行数据读写操作的只要途径,Extjs提供的数据代理类只要包括两大类,分别是Ext.data.proxy.Client客户端代理和Ext.data.proxy.Server服务器代理,他们都继承自Ext.data.proxy.Proxy类,客户端代理和服务器代理的子类如下所示,公有7个。

    客户端代理:

    Ext.data.proxy.Menory、Ext.data.proxy.WebStorage、Ext.data.proxy.LocalStorage、Ext.data.proxy.SessionStorage

    服务器代理:

    Ext.data.proxy.Ajax、Ext.data.proxy.Rest、Ext.data.proxy.JsonP

    1、Ext.data.proxy.Proxy

    Ext.data.proxy.Proxy是所有代理类的父类,它定义了代理的基本行为和接口,通过代理操作数据的基本原则是执行Create(创建)、Read(读取)、Update(更新)和Delete(删除)操作,这4个操作被映射到create、read、update和destory这四个函数中,Ext.data.proxy.Proxy的每一个子类都需要分别实现这些函数,每一个CRUD方法会得到唯一的Ext.data.Operation对象作为参数,其中封装了操作的详细内容,另外每一个CRUD方法都可以指定回调函数对数据进行处理。下表中列出了Ext.data.proxy.Proxy类所支持的主要配置项。

    表1-1 Ext.data.proxy.Proxy主要配置项

    配置项 参数类型 说明
    batchActions Boolean 设置是否执行批量操作,默认为true
    batchOrder String 设置批量执行操作的顺序,默认为‘create,update,destory’
    model String/Ext.data.Model 设置需要通过代理支持的模型类的名称或引用

    2、Ext.data.proxy.Client

    Ext.data.proxy.Client是在客户端进行数据存储操作的基类,通常情况下不会直接进行实例化,而是使用它的两个子类:Ext.data.proxy.Memory内存代理和Ext.data.proxy.WebStorage浏览器存储代理。

    3、Ext.data.proxy.Menory

    Ext.data.proxy.Menory是一个简单的数据代理,它使用内存变量存取数据,因此在每一次页面刷新之后数据都会丢失,他的主要方法如下:

    配置项

    参数类型 说明
    data Array 配置用于读取的记录数组

    4、Ext.data.proxy.WebStorage

    Ext.data.proxy.WebStorage是浏览器客户端存储代理的简单父类,它依赖HTML5的新特性DOM Storage ,该特性支持开发工具具有离线功能的web应用,虽然当前浏览器支持以Cookie来存储数据,但是cookie长度非常小,而且功能有限。

    配置项

    参数类型 说明
    id String 用于在浏览器客户端区分数据存储区域的唯一标识

    DOM storage分为两类,sessionStorage和localStorage,他们主要区别如下:

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

    localStorage:由于长期存储数据。窗口关闭之后,localStorage中的数据仍然可以被访问,所有浏览器窗口可以共享localStorage的数据。

    5、Ext.data.proxy.LocalStorage

    Ext.data.proxy.LocalStorage 是Ext.data.proxy.WebStorage 的子类,它使用HTML 5的localStorage API在客户端保存数据,由于HTML 5的localStorage不能存储复杂的数据因此在读写操作时LocalStorage代理会自动序列化和反序列化数据。

    LocalStorage代理经常用来保存不需要存储在服务器的用户信息,这写信息不会在浏览器关闭后消失,可以长期保存。

    由于HTML 5的localStorage API会将所有的数据放在一个单独共享的命名空间下,因此为了区分不同类型的业务数据需要为LocalStorage代理指定一个唯一的id,通过唯一的id代理才可以实现数据的有效管理。

    6、Ext.data.proxy.SessionStorage

    Ext.data.proxy.SessionStorage是Ext.data.proxy.WebStorage 的子类,它使用HTML 5的localStorage API在客户端保存数据,它与Ext.data.proxy.LocalStorage的区别在于当浏览器关闭之后数据会丢失,不适合长期保存数据,除此之外与LocalStorage代理的使用方法完全相同。

    7、Ext.data.proxy.Server

    Ext.data.proxy.Server是服务器代理的父类,他一般不直接进行实例化,与客户端代理不同,服务器代理会访问远程的服务器资源,适合长期保存重要的数据资料,Ext.data.proxy.Server的主要配置项如下表所示:

    表7-1 Ext.data.proxy.Server主要配置项

    配置项

    参数类型 说明

    api

    Object

    配置执行CRUD操作的url默认为

    api:{ read: undefined,

    create: undefined,

    update: undefined,

    destroy: undefined

    }

    如果没有指定则CRUD将直接请求原始的url

    cacheString

    String

    设置用于破坏浏览器缓存随机参数的参数名,默认为_dc

    directionParam

    String

    设置排序的目标参数,只有当simpleSortMode的设置为true是生效,默认为dir

    extraParams

    Object

    设置包括在每一次请求中的扩展参数,个别请求中的参数名如果与其冲突则extraParams中的参数将被覆盖掉

    filterParam

    String

    设置过滤器的参数名,默认为filter,如果不希望向后台传递过滤器参数则将该配置项设为undefined

    groupParam

    String

    设置默认分组的参数名,默认为group,如果不希望向后台传递分组参数则将该配置项设为undefined

    limitParam

    String

    设置页面大小参数,默认为limit,如果不希望向后台传递则将该配置项设为undefined

    noCache

    Boolean

    设置是否防止浏览器缓存,默认为true不缓存,通过cacheString 配置的随机参数将被追加到请求的Url中

    pageParam

    String

    设置起始页参数名默认为page,如果不希望向后台传递则将该配置项设为undefined

    reader

    object/String/Ext.data.reader.Reader

    设置用于解析服务器端想要的数据读取器,可以是一个读取器实例,配置对象或者有效的读取器类型如json,xml

    simpleSortMode

    Boolean

    设置是否启用简单排序模式,如果启用则在发起远程排序时只会传递一个排序属性和一个排序方式(ASC或DESC)到服务器,dirParam和sortParam分别用于传递这两个参数

    sortParam

    String

    设置排序参数名,默认为sort,如果不希望向后台传递则将该配置项设为undefined

    startParam

    string

    设置起始页参数名,默认为page,如果不希望向后台传递则将该配置项设为undefined

    timeout

    Number

    设置请求的超市时间,默认为30秒

    url

    String

    设置请求的服务器url

    writer

    Object/String/Ext.data.writer.Writer 设置用于编码客户点请求数据的写入器,可以是一个写入器实例,配置对象或者有效的读取器类型如json,xml
  • 相关阅读:
    JavaScript&DOM
    avalon.js的循环操作在表格中的应用
    merge()
    建立表空间以及用户
    SSI框架下,用jxl实现导出功能
    SQL递归查询实现组织机构树
    vue+webpack实践
    使用canvas绘制一片星空
    在canvas中使用html元素
    CSS3-transform 转换/变换
  • 原文地址:https://www.cnblogs.com/lslvxy/p/3074026.html
Copyright © 2011-2022 走看看