Firebase RTDB数据无法在SwiftUI List视图中显示的问题

我看了你的代码，问题主要出在fetchData方法的逻辑和UI更新的线程处理上——虽然你能打印出数据，但因为这些问题导致SwiftUI列表没触发刷新。下面一步步来修复：

问题分析 #

• 不必要的重复查询：你已经通过ref.observeSingleEvent(of: .value)拿到了所有users节点的数据，却又在遍历子节点时再次发起查询，这不仅多余，还会打乱数据解析的时机。
• 后台线程更新UI：Firebase的数据库回调默认在后台线程执行，而SwiftUI的@Published属性必须在主线程更新才能触发UI刷新。
• completion调用时机错误：你现在每个子节点回调里都调用completion，会导致每次添加一个Player就触发一次回调，但列表刷新依赖@Published的players数组，这种方式反而会干扰UI更新逻辑。

修复后的代码 #

1. 重构PlayerViewModel的fetchData方法 #

class PlayerViewModel: ObservableObject {
    @Published var players = [Player]()
    let ref = Database.database().reference().child("users")
    
    func fetchData() {
        ref.observeSingleEvent(of: .value, with: { snapshot in
            // 先初始化临时数组存储解析后的数据
            var fetchedPlayers = [Player]()
            
            guard let children = snapshot.children.allObjects as? [DataSnapshot] else {
                // 无数据时回到主线程更新UI
                DispatchQueue.main.async {
                    self.players = fetchedPlayers
                }
                return
            }
            
            for child in children {
                let value = child.value as? NSDictionary
                // 用Firebase节点的key作为Player的id，更贴合数据唯一性
                let player = Player(
                    id: child.key,
                    username: value?["username"] as? String ?? "",
                    score: value?["score"] as? Int ?? 0
                )
                fetchedPlayers.append(player)
            }
            
            // 可选：按分数从高到低排序
            fetchedPlayers.sort { $0.score > $1.score }
            
            // 回到主线程更新@Published属性，触发UI刷新
            DispatchQueue.main.async {
                self.players = fetchedPlayers
            }
        })
    }
}

2. 调整PlayerListView的onAppear调用 #

现在不需要completion回调，直接调用fetchData()即可：

struct PlayerListView: View {
    @ObservedObject var viewModel = PlayerViewModel()
    @Binding var showLeaderboard: Bool
    
    var body: some View {
        NavigationView {
            List(viewModel.players) { player in
                VStack(alignment: .leading) {
                    Text(player.username)
                        .font(.headline)
                    Text("\(player.score)")
                        .font(.subheadline)
                }
            }
            .navigationBarTitle("Players")
            .onAppear() {
                self.viewModel.fetchData()
            }
        }
        .onTapGesture {
            self.showLeaderboard.toggle()
        }
    }
}

额外优化建议 #

• 用Firebase节点的key作为Player的id，比生成UUID更合理，也能保证数据唯一性。
• 统一在解析完所有数据后排序，比单个节点查询时排序效率更高。
• 确认Info.plist中已配置Firebase的访问权限，确保App能正常连接RTDB。

这样修改后，当页面出现时触发fetchData，数据解析完成后在主线程更新players数组，SwiftUI列表就会自动刷新显示数据了。

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