如何在预览提供程序的一个视图中使用该视图中的变量集？ [英] How can I use a variable set in one View in the PreviewProvider for that View?

问题描述

我在对服务器的函数调用的完成处理程序中设置了一个名为homesList的变量。但是，homesList在PreviewProvider中不可访问。如何访问预览器中的homesList？

struct HomeRow: View {
var home: Home
@State private var homesList: [Home]

var body: some View {
    HStack {
        Text(home.homeName)
        Spacer()
    }
    .onAppear {
        retrieveHomes(completionHandler: { (json) in
            self.homesList = json
        })
    }
  }
}


struct HomeRow_Previews: PreviewProvider {
  static var previews: some View {
    Group {
        HomeRow(home: homesList[0])
    }
    .previewLayout(.fixed(width: 300, height: 70))
  }
}

推荐答案

将模型管理分离为视图模型并使用依赖项注入，可以模拟视图模型进行预览。

这里是可能的方法的演示。在Xcode 12/iOS 14上测试

struct Home { // just replicated for test
    var homeName: String
}

class HomesViewModel: ObservableObject {
    @Published var homesList: [Home]

    init(homes: [Home] = []) {   // default container
        self.homesList = homes
    }

    func fetchHomes() {
        guard homesList.isEmpty else { return }

        retrieveHomes(completionHandler: { (json) in    // load if needed
            DispatchQueue.main.async {
                self.homesList = json   // should be set on main queue
            }
        })
    }
}

struct HomeRow: View {
    var home: Home
    @ObservedObject var vm: HomesViewModel

    var body: some View {
        HStack {
            Text(home.homeName)
            Spacer()
        }
        .onAppear {
            self.vm.fetchHomes()
        }
    }
}


struct HomeRow_Previews: PreviewProvider {
    static var previews: some View {

        // prepare mock model with predefined mock homes
        let mockModel = HomesViewModel(homes: [Home(homeName: "Mock1"), Home(homeName: "Mock2")])

        return Group {
            // inject test model via init
            HomeRow(home: mockModel.homesList[0], vm: mockModel)
        }
        .previewLayout(.fixed(width: 300, height: 70))
    }
}

这篇关于如何在预览提供程序的一个视图中使用该视图中的变量集？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！