SwiftUI ChatScreen进入时Firebase消息重复显示问题求助

每次进入ChatScreen时消息重复显示，日志提示ID重复，核心原因是：

• 每次onAppear触发时都会调用observeMessages，而Firebase的observe(.childAdded)会注册持久监听，不会自动移除。当离开再返回ChatScreen，旧监听仍在生效，新监听又被添加，导致所有历史消息被重复追加到messages数组，进而触发ForEach的ID重复警告。

1. 给ChatViewModel添加监听管理逻辑 #

Firebase的observe会返回DatabaseHandle，通过保存该句柄，可在不需要监听时移除，避免重复注册。

修改ChatViewModel代码：

class ChatViewModel: ObservableObject {
    @Published var messages = [Message]()
    private var messageObserverHandle: DatabaseHandle? // 存储监听句柄
    
    func observeMessages(groupId: String) {
        // 先移除已存在的监听，防止重复注册
        if let handle = messageObserverHandle {
            databaseRef.removeObserver(withHandle: handle)
        }
        
        let messagesRef = databaseRef.child("groups/\(groupId)/messages")
        messageObserverHandle = messagesRef.observe(.childAdded) { snapshot, error in
            let message = Message(snapshot: snapshot)
            self.messages.append(message)
        }
    }
    
    // 视图消失时调用，移除监听
    func stopObservingMessages() {
        if let handle = messageObserverHandle {
            databaseRef.removeObserver(withHandle: handle)
            messageObserverHandle = nil
        }
    }
    
    // 保留原有的sendMessage方法
    func sendMessage(messageText: String, userId: String, groupId: String, userName: String) {
        // 原有发送逻辑不变
    }
}

2. 在ChatScreen中监听视图生命周期 #

在视图消失时移除监听，进入时清空旧消息并重新注册监听：

修改ChatScreen的body部分：

var body: some View {
    VStack {
        ScrollView{
            VStack(alignment: .leading, spacing: 10) {
                ForEach(chatViewModel.messages, id: \.messageId) { message in
                    MessageView(message: message)
                }
            }
            .padding()
        }
        .onAppear {
            // 进入时清空旧消息，避免残留重复数据
            chatViewModel.messages.removeAll()
            chatViewModel.observeMessages(groupId: groupId)
        }
        .onDisappear {
            // 离开时移除监听，防止后台持续接收消息
            chatViewModel.stopObservingMessages()
        }
        
        HStack {
            TextField("Type your message here", text: $message)
                .textFieldStyle(RoundedBorderTextFieldStyle())
            
            Button("Send") {
                chatViewModel.sendMessage(messageText: message, userId: userId, groupId: groupId, userName: userName)
                message = ""
            }
        }
        .padding()
    }
}

3. 额外优化：确保Message的ID唯一 #

检查Message类的初始化逻辑，确保使用Firebase快照的key作为唯一ID（数据库中每条消息的天然唯一标识），避免自定义ID导致重复：

struct Message: Identifiable {
    let id: String // 遵循Identifiable协议，直接用id作为唯一标识
    let text: String
    let userId: String
    let userName: String
    
    init(snapshot: DataSnapshot) {
        let value = snapshot.value as? [String: Any] ?? [:]
        self.id = snapshot.key // 使用Firebase生成的key作为唯一ID
        self.text = value["text"] as? String ?? ""
        self.userId = value["userId"] as? String ?? ""
        self.userName = value["userName"] as? String ?? ""
    }
}

此时ForEach可简化为ForEach(chatViewModel.messages) { message in }，更简洁安全。

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