如何在SwiftUI的PreviewProvider中模拟EnvironmentObject

嘿，这事儿其实很简单！要在预览里给ListView提供模拟的EnvironmentObject，你只需要两步：创建一个带测试数据的ListData实例，然后用.environmentObject修饰符把它注入到预览的视图层级里就行。

修改后的完整代码示例 #

struct ListView: View {
    @State private var query: String = "Swift"
    @EnvironmentObject var listData: ListData
    
    var body: some View {
        NavigationView {
            List(listData.items) { item in
                ListItemCell(item: item)
            }
        }.onAppear(perform: fetch)
    }
    
    private func fetch() {
        listData.fetch()
    }
}

struct ListView_Previews: PreviewProvider {
    // 创建带模拟数据的ListData实例
    static let previewListData: ListData = {
        let data = ListData()
        // 这里塞一些测试用的ListItem，不用依赖网络请求
        data.items = [
            ListItem(id: "1", title: "SwiftUI入门"),
            ListItem(id: "2", title: "EnvironmentObject详解"),
            ListItem(id: "3", title: "预览技巧")
        ]
        return data
    }()
    
    static var previews: some View {
        // 通过.environmentObject注入模拟数据
        ListView()
            .environmentObject(previewListData)
    }
}

class ListData: ObservableObject { // 注意：SwiftUI 1.0之后BindableObject已升级为ObservableObject
    @Published var items: [ListItem] = [] // 用@Published替代didChange，代码更简洁
    
    func fetch() {
        // 更新items的异步调用
        // self.items = someNetworkResponse
    }
}

// 补充ListItem和ListItemCell的模拟定义（方便预览直接运行）
struct ListItem: Identifiable {
    let id: String
    let title: String
}

struct ListItemCell: View {
    let item: ListItem
    var body: some View {
        Text(item.title)
    }
}

关键说明 #

• 模拟数据实例：我们在PreviewProvider里创建了previewListData，直接给它的items赋值测试数据，这样预览时不用等待异步网络请求，能立刻看到效果。
• 注入环境对象：通过.environmentObject(previewListData)把模拟数据源传递给ListView，这和你在主程序中从App层级或父视图传递EnvironmentObject的逻辑完全一致。
• 小升级提示：如果你的ListData还在使用旧的BindableObject，建议升级成ObservableObject配合@Published属性，这是SwiftUI后续版本推荐的写法，代码更简洁易维护。

这样你的预览就能正常显示带有模拟数据的列表啦，调试起来方便多了！

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