SwiftUI中Firebase加载数组后无法通过索引访问元素求助

问题根源 #

Firestore的getDocuments是异步操作，你在ContentView的init里调用loadSounds后，会立刻执行body的渲染逻辑，但此时categoriesArray还没被Firebase的回调填充，数组是空的，直接访问categoriesArray[0]自然会触发索引越界错误。

而ForEach能正常工作是因为它会自动处理空数组的情况，不会强制访问不存在的索引；loadSounds里的print能正常输出，是因为它在异步回调完成后才执行，此时数组已经被填充。

解决步骤 #

要解决这个问题，需要让SwiftUI感知数组的变化，并且在数组填充完成后再访问索引，具体实现如下：

1. 用可观察对象管理数据

将数组封装到ObservableObject中，利用@Published标记数组，这样数组更新时View会自动重新渲染：

import FirebaseFirestore
import SwiftUI

// 假设你的数据模型定义如下
struct dataSound: Identifiable {
    let id = UUID()
    var name: String
    var image: String
}

struct Category: Identifiable {
    let id = UUID()
    var category: String
    var sounds: [dataSound]
}

class SoundDataManager: ObservableObject {
    @Published var categoriesArray = [Category]()
    
    func loadSounds() {
        Firestore.firestore().collection("data").getDocuments { [weak self] snapshot, error in
            guard let self = self else { return }
            guard let snapshot = snapshot, error == nil else {
                print(error ?? "未知错误")
                return
            }
            
            var tempCategories = [Category]()
            for document in snapshot.documents {
                let name = document.data()["name"] as? String ?? "error"
                let soundsDict = document.data()["sounds"] as? [String: [String: Any]]
                
                var soundsArray = [dataSound]()
                if let soundsDict = soundsDict {
                    for soundEntry in soundsDict {
                        let soundName = soundEntry.value["name"] as? String ?? "error"
                        let soundImage = soundEntry.value["image"] as? String ?? "error"
                        soundsArray.append(dataSound(name: soundName, image: soundImage))
                    }
                }
                
                tempCategories.append(Category(category: name, sounds: soundsArray))
            }
            
            // 必须在主线程更新UI相关数据
            DispatchQueue.main.async {
                self.categoriesArray = tempCategories
            }
        }
    }
}

2. 在View中安全访问数组元素

在ContentView中使用@StateObject实例化数据管理器，先判断数组是否有元素，再访问索引：

struct ContentView: View {
    @StateObject private var dataManager = SoundDataManager()
    
    var body: some View {
        // 先判断数组非空，再访问第一个元素
        if let firstCategory = dataManager.categoriesArray.first {
            Text(firstCategory.category)
        } else {
            Text("加载中...")
        }
    }
    
    init() {
        dataManager.loadSounds()
    }
}

如果一定要通过索引访问，可以这样写：

Text(dataManager.categoriesArray.count > 0 ? dataManager.categoriesArray[0].category : "加载中...")

关键说明 #

• @Published和ObservableObject的组合会让SwiftUI监听数组的变化，数组更新时自动重新渲染View，此时数组已经有数据，访问索引不会越界。
• 异步回调中必须用DispatchQueue.main.async更新数组，因为UI操作必须在主线程执行。
• 先判断数组是否为空是安全访问索引的必要前提，避免触发运行时错误。

内容的提问来源于stack exchange，提问作者L. A.