SwiftUI中异步加载多数据：解决线程阻塞与发布警告问题

核心思路是将耗时的后台加载逻辑与UI状态更新分离：让数据加载在后台线程执行，仅在更新@Published属性（触发UI刷新）时切换回主线程，既避免线程警告，又不阻塞UI交互。

修改后的模型代码 #

class Metadata: ObservableObject {
    @Published var isLoaded = false
    var images: [ImageData] = []
    
    func load() async {
        // 模拟云端元数据加载：耗时操作在后台执行
        await Task.detached {
            sleep(1) // 模拟网络请求耗时
        }.value
        
        // 构造图片数据模型
        images.append(ImageData())
        images.append(ImageData())
        images.append(ImageData())
        
        // 切换到主线程更新UI状态
        await MainActor.run {
            self.isLoaded = true
        }
    }
}

class ImageData: ObservableObject {
    @Published var isLoaded = false
    var data: String = "N/A"

    func load() async {
        // 模拟图片数据加载：耗时操作在后台执行
        let loadResult = await Task.detached { () -> String in
            let us = Int.random(in: 1000000..<3000000)
            usleep(UInt32(us))
            return "Image data is loaded."
        }.value
        
        // 切换到主线程更新UI状态和数据
        await MainActor.run {
            self.data = loadResult
            self.isLoaded = true
        }
    }
}

视图代码（保持原逻辑即可） #

struct ContentView: View {
    @StateObject var metadata: Metadata = Metadata()
    
    var body: some View {
        Group {
            if metadata.isLoaded {
                VStack {
                    ForEach(0..<metadata.images.count, id: \.self) { i in
                        ImageView(image: metadata.images[i])
                    }
                }
            } else {
                ProgressView()
            }
        }
        .task {
            await metadata.load()
        }
    }
}

struct ImageView: View {
    @ObservedObject var image: ImageData
    
    var body: some View {
        Group {
            if image.isLoaded {
                Text(image.data)
            } else {
                ProgressView()
            }
        }
        .task {
            await image.load()
        }
    }
}

关键要点说明 #

1. 后台执行耗时操作：用Task.detached将加载逻辑放到后台线程，避免占用主线程，保证用户可以正常滑动、点击。
2. 主线程更新状态：所有@Published属性的更新都通过await MainActor.run切换到主线程，彻底消除线程警告，确保UI刷新的正确性。
3. 通用适配性：这个模式不局限于图片加载，任何需要异步获取的结构化数据、文件等都可以复用，只需要替换Task.detached内部的加载逻辑即可。
4. 独立加载控制：每张图片的ImageData独立执行load方法，加载过程互不干扰，符合“异步且独立加载”的要求。

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