[Phonegap+Sencha Touch] 移动开发8、store和proxy

2024-01-28 11:58

本文主要是介绍[Phonegap+Sencha Touch] 移动开发8、store和proxy,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

上图是一个支持服务端分页、服务端排序、和服务端过滤的一个store的配置。

一、store
常用的配置参数:
1、autoLoad:Boolean, 表示创建store之后是否立即加载数据,默认false。
因为我们要等到view显示的时候,手动去调用store.load()方法,加载数据

2、autoSync:Boolean, 对store数据的变更(增删改查),是否立即保存,默认false

3、sorters:Array, 排序规则的集合,是一个数组,可以有多个(数组里的每个元素最后都被转换成了Ext.util.Sorter的实例)。写法如:
        sorters: [{
            property: "RequestDate",
            direction: "DESC"
        }]
        或者
        sorters: [Ext.create('Ext.util.Sorter', {
            property: "RequestDate",
            direction: "DESC"
        })]

     Ext.util.Sorter的配置项:
     常用的有
     (1) property:String, 排序的字段;
     (2) direction:String, 排序方向,可选值'ASC', 'DESC';
     还有
     (3) id:为每个排序规则指定一个id;
     (4) sorterFn:Function, 特殊指定一个排序的方法,而不按照property指定的字段来排序。比如有个字段OpDateTime,我不想按照property: OpDateTime排序,而想要格式化成'Y-m-d'之后再排序,此时就应该用sorterFn;
     (5) root:String, 意思就是property是来自record的哪里的。默认值是null,也可以配置为'data',也就是默认排序的字段是record.data里面的;

4、groupField:String, 分组的字段

5、groupDir:String, 分组之间的排序方向,'ASC'(默认)或'DESC'

6、grouper:Object, 即分组排序。
     使用分组功能,需要把用到这个store的dataview控件的grouped设为true。grouper 和 groupField & groupDir 只需要指定一种
     (grouper这个配置最后被转换成为Ext.util.Grouper的实例)     
     Ext.util.Grouper继承自Ext.util.Sorter。所以,grouper也是一个sorter,grouper有sorter的属性。
     (1) property:String, 分组的字段,是分组的依据;
     (2) direction:String, 分组之间的排序方向(组与组之间的,而不是组里内容之间的),可选值'ASC', 'DESC';
还有
     (3) groupFn:Function, 分组的依据。这个配置和property只需要指定一个
          groupFn是一个方法,返回值用于分组(用于property不能满足分组的时候,比如有个字段OpDateTime,我不想按照property: OpDateTime分组,而想要格式化成'Y-m-d'之后再分组,此时就应该用groupFn)
     (4) sortProperty:String, 分组之间的排序依据,一般和property设置成一样字段(我测试过不一样的时候,会出现分组乱了的现象),如果property没有设置,而是设置了groupFn,那么最好是设成groupFn里面用到的字段,或者根据情况设置。

7、pageSize:Int, store分页的每页记录数,默认25
     请求后台数据的参数像这样:?page=1&start=0&limit=25
     start是根据page和limit计算出来的,其实page和start只要其中一个就够了。

8、params:Object, 需要传递到后台的其他参数。默认值{},这个params会给proxy,由proxy去请求数据

9、remoteGroup:Bollean,默认false。如果设置成true,
     请求后台数据的参数像这样:?page=1&start=0&limit=25&group=[{"property":"OpDate","direction":"ASC"}]

10、remoteSort:Bollean,默认false。如果设置成true,
     请求后台数据的参数像这样:?page=1&start=0&limit=25&group=[{"property":"OpDate","direction":"ASC"}]&sort=[{"property":"OpDate","direction":"ASC"}, {"property":"ObjType","direction":"ASC"}]
     注意:
     (1) 如果有store设置了grouper,那么会把grouper指定的字段和方向,作为sort里的第一个元素。
          grouper的property如果没有指定(而是指定了groupFn),那么group和sort的第一个元素会是这样的:{"property":null,"direction":"ASC"}
     (2) 如果proxy的simpleSortMode设置为了true,那么只会传递一个sort规则,例如:?page=1&start=0&limit=25&sort=OpDate&dir=ASC

11、remoteFilter:Bollean,默认false。如果设置成true,
     请求后台数据的参数像这样:?page=1&start=0&limit=25&filter=[{"property":"UserName","value":"Admin"},{"property":"ObjName","value":"采购订单"}]

二、proxy
proxy有很多类型,type配置的可选值有ajax, direct, jsonp, rest, localStorage, sessionStorage, sql等
ajax算是前4种的基础了,用的也比较多。最后3种是本地存储。
通过给ajax配置api属性、或者使用direct、rest可以很方便实现简单的增删改查(CRUD,Create, Retrieve, Update, Delete)。
实际使用中一般通过ajax获取数据,增删改还是手动控制的多。
顶上的图,就是配置的ajax获取数据。
看看主要的配置项:
1、type:String,指定proxy的类型

2、actionMethods:Object,包含create、read、update和destroy四种action,每种action可选值'GET', 'POST',即Http请求的类型,也就是上面说的?page=1&start=0&limit=25是如何传递到后台的。
'GET'就是说page=1&start=0&limit=25拼接到url的后面,'POST'就是post提交
     actionMethods: {
          create: "POST",
          read: "GET",
          update: "POST",     
          destroy: "POST",    
     }

3、simpleSortMode:Boolean,上面的store讲过了

4、extraParams:Object, 需要传递到后台的其他参数。

5、filterParam:String,默认'filter'

6、groupParam:String,默认'group'

7、limitParam:String,默认'limit'

8、pageParam:String,默认'page'

9、sortParam:String,默认'sort'

10、startParam:String,默认'start'
上面6个XXXParam,是作为Http请求数据的参数名,默认就行,最好不要改

11、reader:Object,如何读取获取到的数据,有下面的配置项:
     (1) type:String
     (2) rootProperty:String,默认''。分页的时候可以指定此属性,不分页的时候默认空字符串就行。
     (3) successProperty:String,默认'success'。表示返回数据是否有错误,不是必须的
     (4) totalProperty:String,默认'total'。分页的时候,服务端除了返回当前页的数据,还要返回所有页的数据总条数
     reader: {          
          type: "json",          
          rootProperty: 'root'
     }
向上面这个,说明后台返回的数据是json类型,而且返回的数据类似 {total: 100, root: [{name: 'one'}, {name: 'two'}, {name: 'three'}, {name: 'four'}]}
即total是数据总数,root是当前页的所有数据

12、url:String,请求数据的url来源

这篇关于[Phonegap+Sencha Touch] 移动开发8、store和proxy的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/653575

相关文章

Python实例题之pygame开发打飞机游戏实例代码

《Python实例题之pygame开发打飞机游戏实例代码》对于python的学习者,能够写出一个飞机大战的程序代码,是不是感觉到非常的开心,:本文主要介绍Python实例题之pygame开发打飞机... 目录题目pygame-aircraft-game使用 Pygame 开发的打飞机游戏脚本代码解释初始化部

使用Python开发一个现代化屏幕取色器

《使用Python开发一个现代化屏幕取色器》在UI设计、网页开发等场景中,颜色拾取是高频需求,:本文主要介绍如何使用Python开发一个现代化屏幕取色器,有需要的小伙伴可以参考一下... 目录一、项目概述二、核心功能解析2.1 实时颜色追踪2.2 智能颜色显示三、效果展示四、实现步骤详解4.1 环境配置4.

Python使用smtplib库开发一个邮件自动发送工具

《Python使用smtplib库开发一个邮件自动发送工具》在现代软件开发中,自动化邮件发送是一个非常实用的功能,无论是系统通知、营销邮件、还是日常工作报告,Python的smtplib库都能帮助我们... 目录代码实现与知识点解析1. 导入必要的库2. 配置邮件服务器参数3. 创建邮件发送类4. 实现邮件

基于Python开发一个有趣的工作时长计算器

《基于Python开发一个有趣的工作时长计算器》随着远程办公和弹性工作制的兴起,个人及团队对于工作时长的准确统计需求日益增长,本文将使用Python和PyQt5打造一个工作时长计算器,感兴趣的小伙伴可... 目录概述功能介绍界面展示php软件使用步骤说明代码详解1.窗口初始化与布局2.工作时长计算核心逻辑3

python web 开发之Flask中间件与请求处理钩子的最佳实践

《pythonweb开发之Flask中间件与请求处理钩子的最佳实践》Flask作为轻量级Web框架,提供了灵活的请求处理机制,中间件和请求钩子允许开发者在请求处理的不同阶段插入自定义逻辑,实现诸如... 目录Flask中间件与请求处理钩子完全指南1. 引言2. 请求处理生命周期概述3. 请求钩子详解3.1

如何基于Python开发一个微信自动化工具

《如何基于Python开发一个微信自动化工具》在当今数字化办公场景中,自动化工具已成为提升工作效率的利器,本文将深入剖析一个基于Python的微信自动化工具开发全过程,有需要的小伙伴可以了解下... 目录概述功能全景1. 核心功能模块2. 特色功能效果展示1. 主界面概览2. 定时任务配置3. 操作日志演示

JavaScript实战:智能密码生成器开发指南

本文通过JavaScript实战开发智能密码生成器,详解如何运用crypto.getRandomValues实现加密级随机密码生成,包含多字符组合、安全强度可视化、易混淆字符排除等企业级功能。学习密码强度检测算法与信息熵计算原理,获取可直接嵌入项目的完整代码,提升Web应用的安全开发能力 目录

一文教你如何解决Python开发总是import出错的问题

《一文教你如何解决Python开发总是import出错的问题》经常朋友碰到Python开发的过程中import包报错的问题,所以本文将和大家介绍一下可编辑安装(EditableInstall)模式,可... 目录摘要1. 可编辑安装(Editable Install)模式到底在解决什么问题?2. 原理3.

双系统电脑中把Ubuntu装进外接移动固态硬盘的全过程

《双系统电脑中把Ubuntu装进外接移动固态硬盘的全过程》:本文主要介绍如何在Windows11系统中使用VMware17创建虚拟机,并在虚拟机中安装Ubuntu22.04桌面版或Ubunt... 目录一、首先win11中安装vmware17二、磁盘分区三、保存四、使用虚拟机进行系统安装五、遇见的错误和解决

使用FileChannel实现文件的复制和移动方式

《使用FileChannel实现文件的复制和移动方式》:本文主要介绍使用FileChannel实现文件的复制和移动方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐... 目录使用 FileChannel 实现文件复制代码解释使用 FileChannel 实现文件移动代码解释