You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

iOS15+Firestore点赞按钮实现取消点赞(-1)功能求助

问题:实现点赞/取消点赞的双向计数功能

此前已解决点赞数正常更新的问题,但当前存在新问题:点击点赞按钮时点赞数会+1,但再次点击仍持续+1,需要实现再次点击时点赞数-1的功能。尝试使用.disabled(islike)会直接禁止再次点击按钮,使用Firebase Firestore、iOS15,求实现方案。

代码实现

CellLike.swift

import SwiftUI
import Firebase
import FirebaseFirestoreSwift

struct CellLike: View {
    
    @Binding var isLike: Bool
    @State private var animate = false
    private let animationDuration: Double = 0.1
    private var animationScale: CGFloat {
        isLike ? 0.7 : 1.3
    }
    @ObservedObject var data = getData()
    let timer = Timer.publish(every: 1, on: .current, in: .common).autoconnect()
    
    var body: some View {
        
        VStack {
            
            if self.data.data != nil {
                
                HStack {
                    Button {
                        self.animate = true
                        /// Add +1 Like
                        Firestore.firestore().collection("Like").document("Option").updateData(["ss" : FieldValue.increment(1.0) ])
                        DispatchQueue.main.asyncAfter(deadline: .now() + self.animationDuration) {
                            self.animate = false
                            self.isLike.toggle()
                        }
                    } label: {
                        Image(systemName: isLike ? "heart.fill" : "heart")
                            .resizable()
                            .aspectRatio(contentMode: .fit)
                            .frame(width: 60)
                            .foregroundColor(isLike ? .red : .gray)
                    }
                    .scaleEffect(animate ? animationScale : 1)
                    .animation(.easeIn(duration: animationDuration), value: animate)
//                    .disabled(isLike)
                    /// Number like
                    Text("\(self.data.data.like)")
                        .font(.system(size: 40))
                        .fontWeight(.black)
                        .onReceive(timer) { update in
                            self.data.updateData()
                        }
                }
            }
        }
    }
}

DataManager.swift

import Foundation
import Firebase

struct Datas {
    var like: Int
}

class getData: ObservableObject {
    @Published var data: Datas!
    
    init() {
        updateData()
    }
    
    func updateData() {
        let db = Firestore.firestore()
        
        db.collection("Like").document("Option").getDocument { (snap, err) in
            
            if err != nil {
                print((err?.localizedDescription)!)
                return
            }
            
            let like = snap?.get("ss") as! Int
            
            DispatchQueue.main.async {
                self.data = Datas(like: like)
            }
        }
    }
}

LikeButtonView.swift

struct LikeButtonView: View {
    @AppStorage("isLike") private var isLike = false
    var body: some View {
        CellLike(isLike: $isLike)
    }
}

相关截图

  • Firestore数据库集合:
    Firestore数据库集合

  • 当前点击效果:
    当前点击效果

内容的提问来源于stack exchange,提问作者Denis

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.08.03 21:20:26