android手机微信收藏功能实现,微信小程序收藏功能的实现代码

统一回复,这是我很久以前学习小程序时做的项目,当时是没问题的,最近很多人评论说收藏功能实现不了,但是因为工作原因没空弄

以下是我当时自学小程序的视频地址,里面有收藏的功能的视频,如有需要可以去看看

添加链接描述

给detail.wxml中的收藏图标添加属性:

catchtap是点击事件,wx:if的用法如下:

detail.js

data: {

detailObj:{},

index:null,

// 是否收藏

isCollected:false

handleCollection(){

let isCollected = !this.data.isCollected

this.setData({

// 下面本来是这样子的:isCollected=isCollected,可以简写

isCollected

})

//提示用户

wx.showToast({

title: isCollected ? '收藏成功' : '取消收藏',

icon:'success'

})

结果图

看起来是可以了,但是不难发现当你退出页面再进来按钮又被重置了…

所以我们要把按钮状态保存下来.在handleCollection函数中继续添加:

//点击收藏图标后缓存数据到本地

//把data中的index放到新let出来的index中,因为下面要把index也存进去,要用index来判断你收藏了哪个页面

let { index } = this.data;

//首先去看一下缓存的数据

wx.getStorage({

key:'isCollected',

success:(data)=>{

let obj = data.data;

//如果有,则刷新,没有则追加

obj[index] = isCollected;

wx.setStorage({

key: 'isCollected',

data: obj,

success: () => {

}

});

}

})

在onLoad生命周期函数中添加逻辑:

//根据本地缓存的数据判读用户是否收藏当前文章

let detailStorage = wx.getStorageSync('isCollected')

//如果没有收藏

if (!detailStorage){

//初始化一个空的对象

wx.setStorageSync('isCollected', {});

}

//如果收藏了

if (detailStorage[index]){

this.setData({

isCollected: true

})

}

总结

到此这篇关于微信小程序收藏功能的实现代码的文章就介绍到这了,更多相关微信小程序收藏功能内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！

android手机微信收藏功能实现,微信小程序收藏功能的实现代码相关推荐

微信共享智能充电桩小程序开发功能方案
现如今,新能源汽车使用越来越多,大多数新能源车车主每天为充电而烦恼,微信共享充电桩小程序就能为车主解决充电烦恼,在城市里给用户提供方便快捷的充电体验. 微信共享充电桩小程序功能: 1.充电桩查询充电 ...
小程序能打开html页面,小程序新功能直接打开网页
原标题:小程序新功能直接打开网页喜讯小程序终于又开放新功能了,小程序的功能越来越强大了. 我想这个功能不管对对商家还是对开发人员都是非常好的功能,因为可以打开网页代表他可以链接更多,小程序最多可以关 ...
代驾小程序开发功能模块介绍
代驾小程序开发,代驾小程序开发功能,代驾小程序开发功能模块.伴随着时下在我国车辆市场的需求的完善与驾驶安全防范意识的不断提升,及其交通法规愈来愈标准,愈来愈认真细致,"代驾"领域已 ...
微信 php收藏功能实现,关于微信小程序收藏功能的实现
这篇文章主要介绍了微信小程序收藏功能的实现代码,基本功能是点击收藏后显示已收藏,在另一个页面出现目前点击收藏的项目.需要的朋友可以参考下需求点击收藏后显示已收藏,在另一个页面出现目前点击收藏的项目 ...
浅谈微信小程序的功能定位和使用场景
作者主页:Designer 小郑作者简介:浙江某公司软件工程师,负责开发管理公司OA.CRM业务系统,全栈领域优质创作者,CSDN学院.蓝桥云课认证讲师,开发过20余个前后端分离实战项目,主要发展方 ...
【React-Native】集成微信官方安卓端SDK，实现微信登录、发送/分享小程序消息等功能
github地址:https://github.com/afresh/react-native-wechat-android 网上已有成熟的第三方插件react-native-wechat(以下简称R ...
微信小程序蓝牙功能开发与问题记录
一.蓝牙支持情况 1. 微信小程序对蓝牙的支持情况目前普遍使用的蓝牙规格:经典蓝牙和蓝牙低功耗. 经典蓝牙(蓝牙基础率/增强数据率):常用在对数据传输带宽有一定要求的大数据量传输场景上,比如需要传输 ...
微信支付，JSAPI支付，APP支付，H5支付，Native支付，小程序支付功能详情以及回调处理
一.支付相关文档地址支付wiki:https://pay.weixin.qq.com/wiki/doc/apiv3/index.shtml 支付api: https://pay.weixin.qq. ...
微信小程序插件功能页开发详细流程
有问题可以扫码加我微信,有偿解决问题.承接小程序开发. 微信小程序开发交流qq群 173683895 . 526474645 : 正文: 关于新出的微信小程序插件功能页做一下记录,希望能帮到大 ...
vc++6.0获取磁盘基本信息_微信小程序——常用功能2：微信小程序用户登录，申请用户授权并获取用户基本信息...
微信小程序--常用功能2:申请用户授权并获取用户基本信息为了更好的用户体验,很多时候我们想要获取用户的基本信息,从而实现将信息呈现到用户界面.给用户划分地域.给用户分类等功能. 但是要想获取用户信息 ...

android手机微信收藏功能实现,微信小程序收藏功能的实现代码

android手机微信收藏功能实现,微信小程序收藏功能的实现代码相关推荐

最新文章

热门文章