sencha touch笔记(11)——localstorage实现本地收藏功能以及图标的变换
来源:互联网 发布:数据泄露dlp效果 编辑:程序博客网 时间:2024/05/21 22:45
st实现收藏功能一个是通过调用接口,另一个是通过localstorage进行本地数据的保存和存储获取。如果是本地进行存储并且要实现收藏按钮随时更新状态,并且能够根据时候收藏进行变化的话,就需要每次展现页面数据的时候查看当前数据是否在localstorage里面,如果是的话,就添加一个收藏样式的图标,如果不是的话,则添加一个还没有收藏样式的图标。比如在我这里,每次要去加载页面的时候都要去看下localstorage的情况:
var isLiked = favourites.find('id', likecoureseId);if(isLiked === -1) {var btnCol= Ext.ComponentQuery.query('button[text = "收藏"]')[0];btnCol.setIconCls('like_icon');}else {var btnCol= Ext.ComponentQuery.query('button[text = "收藏"]')[0];btnCol.setIconCls('after_like_icon');}通过这种近似于‘轮询’的方式可以实现localstorage的收藏按钮的同步变化;
要实现点击收藏的功能,需要的函数一个是add,一个是remove,其实在localstorage里面保存的到底还是一个store而已,只不过你将这个store的存储方式定义为了‘localstorage’而已。那么在执行收藏操作的时候直接将当前的数据塞到对应的store内即可。代码如下:
likeAct: {tap: function(btn) {var me = this;var likecoureseId = PiNewsRecord.id;var favourites = Ext.data.StoreManager.lookup('LikeNews_store');var isLiked = favourites.find('id', likecoureseId);if(isLiked === -1) {favourites.add(PiNewsRecord); util.showMessage('收藏成功', true); //Ext.Msg.alert('收藏成功'); var likeBtn = document.getElementsByClassName("item_button_style")[1]; btn.setIconCls('after_like_icon');}else {favourites.remove(favourites.getAt(isLiked));util.showMessage('取消收藏', true);btn.setIconCls('like_icon');}favourites.sync();}},
而对于在线收藏的原因应该也差不多,只不过相对于localstorage轮询式的查询方式,在线收藏要做的只是判断一下调用收藏接口时所返回的状态值而已。
1 0
- sencha touch笔记(11)——localstorage实现本地收藏功能以及图标的变换
- sencha touch 搜索功能search的实现
- sencha touch笔记(10)——简单实现slide navigation
- Sencha Touch笔记(11)——Ext.String
- sencha-touch下借助phoneGap实现拍照,二维码的功能
- sencha-touch下借助phoneGap实现拍照,二维码的功能
- Sencha Touch 自定义图标
- sencha touch笔记——Carousel组件自动滚动实现及代码
- sencha touch 功能简介
- Sencha Touch 2.4实现自定图标指南
- [Phonegap+Sencha Touch] 移动开发7、Sencha Touch图标的使用与自定义
- [Phonegap+Sencha Touch] 移动开发7、Sencha Touch图标的使用与自定义
- Sencha Touch中使用标准LocalStorage
- Sencha Touch 2 结合HTML5的本地存储创建数据库实现增、删、改、查
- sencha touch笔记(1)——基础安装配置
- sencha touch笔记(2)——ExtJs语法基础
- sencha touch笔记(8)——XTemplate
- 本地存储—localStorage
- 黑马程序员 java基础IO FileInputStream
- 黑马程序员 java基础IO随笔
- 【Dijkstra】【Floyd】-HDU-2544-最水题演示
- 黑马程序员 java基础IO操作原则随笔
- 黑马程序员 java银行业务调度系统 随笔
- sencha touch笔记(11)——localstorage实现本地收藏功能以及图标的变换
- 黑马程序员 java交通灯随笔
- QEMU 的 CPU 配置
- Bloomberg面经
- Palindrome Partitioning
- Leetcode: reverse words in a string
- 如何计算时间复杂度
- Auto Rebuild Indexes
- Copy List with Random Pointer -- LeetCode