怎么在小程序中实现一个点赞收藏功能
作者
今天就跟大家聊聊有关怎么在小程序中实现一个点赞收藏功能,可能很多人都不太了解,为了让大家更加了解,小编给大家总结了以下内容,希望大家根据这篇文章可以有所收获。
具体如下:
/收藏/
focusFavoriteTab:function(e){ varthat=this; varisFocus=that.data.isFocus; console.log("isFocus",isFocus) varitemId=that.data.itemId; if(isFocus){ favoriteService.cancel(that,itemId).then((res)=>{ wx.showToast({ title:"取消收藏", icon:'success', duration:1000 }); this.setData({ isFocus:false, }); }) }else{ favoriteService.add(that,itemId).then((res)=>{ wx.showToast({ title:res.data==1?"收藏成功":"收藏失败", icon:'success', duration:1000 }); this.setData({ isFocus:true, }); }); } },
/点赞/
focuslikeTab:function(e){ varthat=this; varisLike=that.data.isLike; letitemDetail=this.data.itemDetail varitemId=that.data.itemId; if(isLike){ itemService.cancellike(that,itemId).then((res)=>{ wx.showToast({ title:"点赞取消", icon:'success', duration:1000 }); itemDetail.liked--; this.setData({ itemDetail:itemDetail }); this.setData({ isLike:false, }); }) }else{ itemService.addlike(that,itemId).then((res)=>{ wx.showToast({ title:res.data==1?"点赞成功":"点赞失败", icon:'success', duration:1000 }); itemDetail.liked++; this.setData({ itemDetail:itemDetail }); this.setData({ isLike:true, }); }); } },
取消点赞功能
/*更新点赞*/ update_zan:function(e){ varthat=this; vardata=e.currentTarget.dataset; varmid=data.mid; varcookie_mid=wx.getStorageSync('zan')||[];//获取全部点赞的mid varisadd=1; varnewmessage=[]; if(cookie_mid.includes(mid)){//说明已经点过赞,取消赞 isadd=0; varm=0; for(varjincookie_mid){ if(cookie_mid[j]!=mid){ newmessage[m]=cookie_mid[j]; m++ } } wx.setStorageSync('zan',newmessage);//删除取消赞的mid }else{ cookie_mid.unshift(mid); wx.setStorageSync('zan',cookie_mid);//新增赞的mid } wx.request({ url:app.globalData.api.api_system, data:{ action:'zannum', mid:mid, isadd:isadd, wxid:app.globalData.wxid }, method:'GET', //header:{}, success:function(res){ varmessage=that.data.message; for(variinmessage){ if(message[i].mid==mid){ if(isadd){ message[i].zan=parseInt(message[i].zan)+1 }else{ message[i].zan=parseInt(message[i].zan)-1 } } } that.setData({ message:message }) } })
重点注意代码:
(1)要把所有已经点过赞的留言id给存储到本地缓存之中,这样如果重复点赞的,就可以判断出来,并取消点赞,取消点赞的同时要去掉缓存中的id;
(2)新增点赞和取消点赞用到同一个api,通过isadd=1或者isadd=0来判断是新增还是取消点赞
(3)为了不频繁去读取留言列表,可以直接调用this.data.message,并通过循环遍历改变某个留言的点赞数,然后直接重新赋值,就能动态改变点赞数!
看完上述内容,你们对怎么在小程序中实现一个点赞收藏功能有进一步的了解吗?如果还想了解更多知识或者相关内容,请关注恰卡编程网行业资讯频道,感谢大家的支持。
目录
推荐阅读
0 条评论
本站已关闭游客评论,请登录或者注册后再评论吧~