前言

哈喽大家好，本期是微信小程序专栏第二十期。本期主要内容是文章点赞功能的实现。
每期内容是连载呢，建议大家可以看看往期内容，更好理解噢~

效果图

在这里插入图片描述

实现步骤

点赞功能的思路和上期收藏的思路是一样的噢~

 // 点赞功能
    up(){
        var data = this.updatePostData('up');
        return data;
    }

在这里插入图片描述

// 更新本地的点赞、评论信息、收藏、阅读量
    updatePostData(category){
        var itemData = this.getPostItemById(),
        postData = itemData.data,
        allPostData = this.getAllPostData();
        switch(category){
            case 'collect':
                // 处理收藏，如果当前状态是未收藏，则增加数量，否则减少数量。
                if(!postData.collectionStatus){
                    // 当前状态是未收藏
                    postData.collectionNum++;
                    postData.collectionStatus = true;
                }else{
                    // 当前状态是收藏
                    postData.collectionNum--;
                    postData.collectionStatus = false; 
                }
                break;
                // 处理点赞功能
            case 'up':
                if(!postData.upStatus){
                    postData.upNum++;
                    postData.upStatus = true;
                }else{
                    postData.upNum--;
                    postData.upStatus = false;
                }
                break;
            default:
                break;
        }
        // 更新缓存数据库
        allPostData[itemData.index] = postData;
        this.execSetStorageSync(allPostData);
        return postData;
    }

在这里插入图片描述

 // 点赞功能事件
    onUpTap:function(event){
        var newData = this.dbPost.up();
        this.setData({
            'post.upStatus':newData.upStatus,
            'post.upNum':newData.upNum
        })
    }