最近在sencha项目中做搜索功能时遇到卡顿现象,数据也不多就一百多条
以下是搜索代码
Controller:
onSearchKeyp: function(field) {
//get the store and the value of the field
var value = field.getValue(),
store = Ext.getStore('Customers');
//first clear any current filters on the store. If there is a new value, then suppress the refresh event
store.clearFilter(!!value);
//check if a value is set first, as if it isnt we dont have to do anything
if (value) {
//the user could have entered spaces, so we must split them so we can loop through them all
var searches = value.split(','),
regexps = [],
i, regex;
//loop them all
for (i = 0; i < searches.length; i++) {
//if it is nothing, continue
if (!searches[i]) continue;
regex = searches[i].trim();
regex = regex.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g, "\\$&");
//if found, create a new regular expression which is case insenstive
regexps.push(new RegExp(regex.trim(), 'i'));
}
//now filter the store by passing a method
//the passed method will be called for each record in the store
store.filter(function(record) {
var matched = [];
//loop through each of the regular expressions
for (i = 0; i < regexps.length; i++) {
var search = regexps[i];
var didMatch = search.test(record.get('customerName'));
//if it matched the first or last name, push it into the matches array
matched.push(didMatch);
}
return (regexps.length && matched.indexOf(true) !== -1);
});
}
},
view:
关键在这里,经过反复查找发现是因为开始没有写
infinite: true,所以会有卡顿现象
id : 'clientList',
disableSelection: true,
scrollable : 'vertical',
xtype : 'list',
store : "app0010000002Store",
flex : 1,
itemTpl : new Ext.XTemplate("<div><span>{customerName}</span></div>"),
infinite: true,
分享到:
相关推荐
这个压缩包“touch-docs-2.2.1.zip”包含了Sencha Touch 2.2.1版本的离线API参考文档,对于深入理解和使用Sencha Touch进行开发具有极大的帮助。 首先,让我们详细了解一下Sencha Touch 2.2.1的核心特性: 1. **...
web 应用的 JavaScript 框架,它基于 HTML5 和 CSS3 的 web 标准,全面兼容 Android 和 Apple iOS,通过 Sencha Touch 框架用户可以创建非常像移动设备本地应用的 web 应用,它提供了丰富的华丽的控件和强大的功能,...
《Sencha Touch in Action》是一本关于使用Sencha Touch进行跨平台移动开发的书籍,它详细介绍了Sencha Touch框架的使用方法和技巧。Sencha Touch是一个利用HTML5、CSS3和JavaScript创建移动Web应用程序的框架,它是...
2. **模型(Model)与存储(Store)**:Sencha Touch使用MVC(Model-View-Controller)架构。模型用于定义数据结构和业务逻辑,而存储则负责管理数据,包括加载、保存和同步到服务器。 3. **视图(View)与控制器...
Sencha Touch 是一款专为移动设备设计的JavaScript框架,它提供了丰富的组件库和强大的数据管理功能,用于...对于初学者来说,理解这一过程有助于更好地掌握Sencha Touch的架构和组件使用,从而进一步提升开发能力。
《般若人生》是一款基于Sencha Touch框架开发的移动应用项目。Sencha Touch是一个流行的JavaScript框架,专门用于构建跨平台的触屏友好型Web应用程序。它提供了丰富的UI组件和强大的数据管理工具,使得开发者能够...
总结,"sencha touch list demo"展示了如何使用Sencha Touch的List组件和Store来构建一个动态的数据展示界面。通过理解和实践这个示例,开发者可以更好地掌握Sencha Touch中数据驱动UI的设计原则,以及如何创建交互...
但在生产环境中,为了优化性能,我们会使用按需加载的精简版(如sencha-touch.js)。 3. **app.js**:这是应用程序的核心文件,定义了应用程序的架构,包括模型(Models)、视图(Views)、控制器(Controllers)和...
Sencha Touch是一款强大的JavaScript框架,专门...对于初学者来说,这是一个非常宝贵的资源,能够帮助他们快速上手并熟练掌握Sencha Touch 2的使用。对于有经验的开发者,中文版文档则能降低语言障碍,提高开发效率。
Sencha Touch 是一款用于构建移动应用的前端框架,它提供了丰富的组件库和强大的数据管理功能,使得开发者可以...通过安装和使用这个插件,开发者可以在熟悉的VSCode环境中享受到专门为Sencha Touch优化的开发体验。
通过解压并研究这些文件,开发者可以详细了解框架的结构,学习如何配置、使用和扩展Sencha Touch,以创建自己的移动应用。同时,这个版本的更新日志(如果有的话)通常会列出所有的新功能、改进和已知问题,是理解...
1. **获取Sencha Touch 2 源码** - 打开终端或命令提示符,使用Git克隆Sencha Touch 2的官方仓库: ``` git clone https://github.com/sencha/Sencha-Touch.git ``` 2. **创建新项目** - 使用Sencha CMD创建一个...
Sencha Touch 和 FusionCharts 的结合使用,是一种在移动设备上创建交互式图表和图形的高效方式。Sencha Touch 是一个流行的JavaScript框架,专门用于构建触摸优化的移动Web应用程序,而FusionCharts则是一款强大的...
标题中的"api.zip_sencha _sencha touch api_sencha touch2 api"表明这是一个关于Sencha Touch API的压缩文件集合,可能包含了Sencha Touch和Sencha Touch 2两个版本的API文档。 **Sencha Touch基础知识** Sencha ...
5. **命令式编程**:Sencha Touch 使用基于Ext JS的命令式编程风格,通过配置对象来定义组件行为。 深入学习Sencha Touch 1.0.1a,你将掌握如何创建响应式的布局、实现动态数据加载、处理用户触摸事件等技能。同时...
Sencha Touch SDK工具是开发移动应用的重要资源,尤其对于那些希望使用Sencha Touch框架构建触控友好、跨平台Web应用程序的开发者来说。Sencha Touch是一个强大的JavaScript库,它提供了丰富的UI组件和API,使得...
Sencha Touch 2 支持使用LocalStorage、WebSQL或IndexedDB等本地存储方案,以保存离线数据。在源码中,可能包含用于与数据库交互的模型和控制器代码。 总的来说,"Sencha Touch2 MVC Demo"是一个学习和实践移动应用...
Sencha Touch 和 Cordova(PhoneGap)是两个在移动应用开发中广泛使用的框架。Sencha Touch 是一个专门用于创建触屏设备上的富交互应用的JavaScript库,提供了丰富的UI组件和强大的数据管理功能。Cordova(PhoneGap...