虽然Sencha Touch本身有和Store关联的LocalStorageProxy,但是使用起来限制性较大,比如复杂的TreeStore就没法正常使用。
所以,我使用灵活性更好的Html5标准LocalStorage。
下面举例说明用法:
首先在App.js中声明全局LocalStorage变量:
Ext.application({ name : 'MobileOA', platform : typeof WL === 'undefined' ? "" : WL.Client.getEnvironment(), // loads the views used by the app from the app/view folder views : [], // loads app/store/Demos.js, which contains the tree data for our main // navigation NestedList stores : [ 'Navs', 'Attachments', 'ToDos', 'CompanyDocuments', 'DeptDocuments', 'Depts', 'MoreItems' ], // of device detected profiles : [ 'Tablet', 'Phone' ], // 本地存储 localStorage : window.localStorage )}
然后自定义一个所有Controller的基类BaseController,在里面添加Set和Get方法,方便其它Controller调用存取持久化内容。
/** * @class MobileOA.controller.BaseController * @extends Ext.app.Controller */ Ext.define('MobileOA.controller.BaseController', { extend : 'Ext.app.Controller', /** * 控制所有页面的创建显示 */ showView : function(navigation, name) { console.log(name); var view = Ext.create("MobileOA.view." + name); navigation.push(view); }, animateView : function(name, animate, direction) { console.log(name); var view = Ext.create("MobileOA.view." + name); Ext.Viewport.animateActiveItem(view, { type : animate, direction : direction }); }, /** * NavigationView Pop View */ pop : function(navigation, count) { // var count = arguments[0] ? arguments[0] : 0; if (!count) count = 0; navigation.pop(count); }, /** * 保存本地存储 */ storeSet : function(key, value) { this.getApplication().localStorage.setItem(key, value); }, /** * 获取本地存储 */ storeGet : function(key) { return this.getApplication().localStorage.getItem(key); }, });
在需要使用LocalStorage的Controller中进行相关方法调用
/** * 页面初始化 */ onDeptContainerInit : function() { var app = this.getApplication(); var me = this; var items = me.storeGet("deptLocal"); var storeName = "Depts"; // 如果LocalStorage存在之前保存的JSON格式对象,则从LocalStorage中获取 if (items != null) { store = Ext.getStore(storeName).load(); store.setData(JSON.parse(items)); // 否则,从服务器端获取 } else { var data = { adapter : "OADept", procedure : "getDepts", parameters : [] }; app.getAdapterProcess(storeName, null, data, true, function(items) { //将从服务器端获取的数据转化成String,并存储在LocalStorage中 me.storeSet("deptLocal", JSON.stringify(items)); }); } },
相关推荐
sencha touch中文翻译文档,包含sencha touch入门基础和一些控件的使用说明
Sencha Touch 是第一个专门设计为移动设备开发 web 应用的 JavaScript 框架,它基于 HTML5 和 CSS3 的 web 标准,全面兼容 Android 和 Apple iOS,通过 Sencha Touch 框架用户可以创建非常像移动设备本地应用的 web ...
Sencha Touch开发的项目《般若人生》源码
sencha touch 应用案例 sencha touch 案例 一个完整的sencha touch 应用案例 移动WEB社区开发的日志案例 非常不错!
sencha touch 折叠list
针对sencha touch 2.3中datepicker的汉化
MAC OS 下sencha touch +cordova 开发环境配置。可以将H5 hybird 应用打包成IOS 应用。
sencha touch 2.4.0最新版 原版包下载
讲其解压到Tomcat的webAPP目录下,即可访问
Sencha Touch 2入门教程之MVC 讲解如何使用 Sencha Touch 2 mvc模式来开发一个登录界面
sencha touch list demo
sencha touch cookbook 英文高清文字版 !
产品正式运行阶段时均从app-all.js脚本文件中动态加载应用程序所需使用的Sencha Touch 2框架的各种类与组件,不需要使用到sdk子文件夹下的src子文件夹中的任何文件。 3.第十五章的其他子文件夹与“第十六章”子...
sencha touch 是一个移动平台UI开发框架,可以实现各种绚丽的页面效果
这是我做的一个sencha touch 的项目,测试并能运行,希望对大家有帮助
sencha touch源码使用以及API
sencha touch grid
sencha touch动态加载组件及容器内容,防止加载时间过长的问题