返回旧版| 微信建站| 我要建站 | 建站学习 | 加入收藏
小程序当前位置:首页 > cms教程 > 小程序 > 正文

微信小程序实现列表页的点赞和取消点赞功能!

发布时间:2018-01-30 21:49:38   来源:   点击:
今天开发了一个文章的留言版块,于是想到要为某个留言点赞,点过赞的再次点击会取消点赞,代码如下:
  1. /*更新点赞*/ 
  2.   update_zan:function(e){  
  3.     var that = this;  
  4.     var data = e.currentTarget.dataset;  
  5.     var mid = data.mid;  
  6.     var cookie_mid = wx.getStorageSync('zan') || [];//获取全部点赞的mid  
  7.     var isadd = 1;  
  8.     var newmessage = [];  
  9.     if (cookie_mid.includes(mid)){//说明已经点过赞,取消赞  
  10.       isadd = 0;  
  11.       var m = 0;  
  12.       for (var j in cookie_mid){  
  13.         if(cookie_mid[j] != mid){  
  14.           newmessage[m] = cookie_mid[j];  
  15.           m++  
  16.         }  
  17.       }  
  18.       wx.setStorageSync('zan', newmessage);//删除取消赞的mid  
  19.     }else{  
  20.       cookie_mid.unshift(mid);  
  21.       wx.setStorageSync('zan', cookie_mid);//新增赞的mid  
  22.     }  
  23.     wx.request({  
  24.       url: app.globalData.api.api_system,  
  25.       data: {  
  26.         action: 'zannum',  
  27.         mid: mid,  
  28.         isadd: isadd,  
  29.         wxid: app.globalData.wxid  
  30.       },  
  31.       method: 'GET',  
  32.       // header: {},   
  33.       success: function (res) {  
  34.         var message = that.data.message;  
  35.         for (var i in message) {  
  36.           if(message[i].mid == mid){  
  37.             if(isadd){  
  38.               message[i].zan = parseInt(message[i].zan) + 1  
  39.             }else{  
  40.               message[i].zan = parseInt(message[i].zan) - 1  
  41.             }  
  42.               
  43.           }  
  44.         }  
  45.         that.setData({  
  46.           message: message  
  47.         })  
  48.       }  
  49.     }) 

重点注意代码:
(1)要把所有已经点过赞的留言id给存储到本地缓存之中,这样如果重复点赞的,就可以判断出来,并取消点赞,取消点赞的同时要去掉缓存中的id;
(2)新增点赞和取消点赞用到同一个api,通过isadd=1或者isadd=0来判断是新增还是取消点赞
(3)为了不频繁去读取留言列表,可以直接调用this.data.message,并通过循环遍历改变某个留言的点赞数,然后直接重新赋值,就能动态改变点赞数!
版权所有:郑州腾石网络科技有限公司 备案信息:豫ICP备18019117号
站长QQ:2863868475 业务合作咨询:15137100750(同微信)
本站所有投放的广告是有其他网站提供,不代表本站立场,同时网站首页广告位对外出租详情咨询本站站长!同时欢迎广大站长加入个人建站团队
  • 建站客服
  • CMS仿站
  • CMS学习
  • 技术交流群:336572814