Combine框架下评论发布后即时展示的解决方案咨询

我希望发布评论后能立即在屏幕的评论列表中显示新评论，目前发布评论后需要重新获取全部商品详情（包含评论列表）才能展示新评论。我使用Combine框架，请问有什么解决方案可以实现评论发布后即时展示？

原ViewModel代码 #

class ProductDetailsViewModel: ObservableObject{
    @Published var productDetails: ProductDetails? = nil
    @Published  var commentText: String = ""
    func fetchProductDetails(id: Int){
        isLoading = true
        service.fetchProductDetails(id: id)
            .receive(on: DispatchQueue.main)
            .sink { [weak self] completion in
                guard let self = self else { return }
                self.isLoading = false
                switch completion {
                case .finished:
                    break
            } receiveValue: { [weak self] response in
                self?.productDetails = response.data
            }
            .store(in: &cancellables)
    } 

func postComment(id: Int){
        isLoading = true
        let parameters: [String: Any] = ["comment": commentText]
        service.postRequest(url: Config.baseURL+"item/\(id)/comment", parameters: parameters, type: CommentResponse.self)
            .receive(on: DispatchQueue.main)
            .sink { [weak self] completion in
                self?.isLoading = false
                switch completion{
                case .finished:
                    break
            } receiveValue: { [weak self] response in
                if let message = response.message{
                    self?.message = message
                }
                self?.commentText = ""
            }
            .store(in: &cancellables)

原View代码片段 #

if let comments = product.comments, !comments.isEmpty {
    VStack(spacing: 10){
        ForEach(comments, id: \.id){ comment in
            AdCommentCellView(comment: comment)
        }
    }
}

解决方案 #

不需要重新请求整个商品详情，以下两种方式可直接更新本地评论列表，实现即时展示：

方案1：直接更新productDetails中的评论列表 #

如果后端在发布评论成功后返回完整的新评论模型（包含id、内容、时间等字段），可直接将其插入到本地评论数组：

修改postComment方法的receiveValue逻辑：

func postComment(id: Int){
    isLoading = true
    let parameters: [String: Any] = ["comment": commentText]
    service.postRequest(url: Config.baseURL+"item/\(id)/comment", parameters: parameters, type: CommentResponse.self)
        .receive(on: DispatchQueue.main)
        .sink { [weak self] completion in
            self?.isLoading = false
            switch completion{
            case .finished:
                break
            case .failure(let error):
                // 处理网络错误
                print(error.localizedDescription)
            }
        } receiveValue: { [weak self] response in
            guard let self = self else { return }
            if let message = response.message{
                self.message = message
            }
            // 假设response.data为刚创建的Comment模型
            if let newComment = response.data {
                var updatedComments = self.productDetails?.comments ?? []
                // 插入到数组头部（或末尾，按需调整）
                updatedComments.insert(newComment, at: 0)
                // 更新productDetails触发UI刷新
                self.productDetails?.comments = updatedComments
            }
            self.commentText = ""
        }
        .store(in: &cancellables)
}

方案2：单独维护评论数组（推荐，解耦商品详情与评论） #

将评论列表从productDetails中拆分，用独立的@Published变量维护，更新评论时无需修改整个商品详情模型：

修改ViewModel：

class ProductDetailsViewModel: ObservableObject{
    @Published var productDetails: ProductDetails? = nil
    @Published  var commentText: String = ""
    // 单独维护评论列表
    @Published var comments: [Comment] = []
    
    func fetchProductDetails(id: Int){
        isLoading = true
        service.fetchProductDetails(id: id)
            .receive(on: DispatchQueue.main)
            .sink { [weak self] completion in
                guard let self = self else { return }
                self.isLoading = false
                switch completion {
                case .finished:
                    break
                case .failure(let error):
                    print(error.localizedDescription)
                }
            } receiveValue: { [weak self] response in
                self?.productDetails = response.data
                // 初始化评论列表
                self?.comments = response.data?.comments ?? []
            }
            .store(in: &cancellables)
    } 

    func postComment(id: Int){
        isLoading = true
        let parameters: [String: Any] = ["comment": commentText]
        service.postRequest(url: Config.baseURL+"item/\(id)/comment", parameters: parameters, type: CommentResponse.self)
            .receive(on: DispatchQueue.main)
            .sink { [weak self] completion in
                self?.isLoading = false
                switch completion{
                case .finished:
                    break
                case .failure(let error):
                    print(error.localizedDescription)
                }
            } receiveValue: { [weak self] response in
                guard let self = self else { return }
                if let message = response.message{
                    self.message = message
                }
                // 添加新评论到本地列表
                if let newComment = response.data {
                    self.comments.insert(newComment, at: 0)
                }
                self.commentText = ""
            }
            .store(in: &cancellables)
    }
}

修改View代码：

if !viewModel.comments.isEmpty {
    VStack(spacing: 10){
        ForEach(viewModel.comments, id: \.id){ comment in
            AdCommentCellView(comment: comment)
        }
    }
}

注意事项 #

• 确保后端返回的CommentResponse包含完整评论模型，若未返回，可自行用当前时间、用户信息等补全
• 必须处理网络请求失败的情况，避免空指针或UI异常
• 若需保证评论顺序与后端一致，插入时可按时间戳排序

内容的提问来源于stack exchange，提问作者Mohamed