更改 SwiftUI PreviewProvider 中的模型视图状态

2024-03-12

我正在努力寻找一种干净的方法来预览 SwiftUI 视图,这些视图具有一个视图模型,该视图模型的某些状态可以在视图的整个生命周期中发生变化。这是一些稍微做作的代码来说明我使用的模式。

import SwiftUI

enum NetworkState {
    case idle
    case loading
    case hasData
    case error
}

public class MyViewModel: ObservableObject {
    
    @Published var results: [String] = []
    
    @Published var state: NetworkState = NetworkState.idle
    
    
    func load() {
        self.results = ["One", "Two", "Three"]
        self.state = .hasData
    }
}

public struct MyView: View {
    
    //MARK: View Model
    @ObservedObject var viewModel: MyViewModel
    
    
    //MARK: Body
    public var body: some View {
        switch self.viewModel.state {
        case NetworkState.idle:
            Text("Tap to load").onTapGesture {
                self.viewModel.load()
            }
        case NetworkState.loading:
            Text("Loading ...")
        case NetworkState.hasData:
            ScrollView {
                ForEach(self.viewModel.results, id: \.self) { string in
                    Text(string)
                }
            }
        case NetworkState.error:
            Text("There was an error")
        }
    }
    
    //MARK: Init
    public init(viewModel model: MyViewModel) {
        self.viewModel = model
    }
    
}

现在,我不想能够预览和更改.state变量来查看我的观点在其整个生命周期中的不同排列。这是我的两次不成功的尝试。

//Does not compile
struct MyView_Previews: PreviewProvider {
    static var previews: some View {
        let viewModel = MyViewModel()
        viewModel.state = .error
        MyView(viewModel: viewModel)
    }
}

//Can not manipulate state after initalization. Also does not compile.
struct MyViewTwo_Previews: PreviewProvider {
    static let viewModel = MyViewModel()
    static var previews: some View {
        viewModel.state = .error
        MyView(viewModel: viewModel)
    }
}

他们都因这个错误而失败

Type '()' cannot conform to 'View'; only struct/enum/class types can conform to protocols

我确信有一种方法,并且我希望它尽可能干净。


你失踪了return预览中的声明。如果你没有return,编译器假设它是一个ViewBuilder并将顶层视为隐式返回,但您正在执行分配变量等工作。

struct MyView_Previews: PreviewProvider {
    static var previews: some View {
        let viewModel = MyViewModel()
        viewModel.state = .idle
        return MyView(viewModel: viewModel)
    }
}

struct MyViewTwo_Previews: PreviewProvider {
    static let viewModel = MyViewModel()
    static var previews: some View {
        viewModel.state = .idle
        return MyView(viewModel: viewModel)
    }
}

更新,在一个预览中显示多个视图:

struct MyView_Previews: PreviewProvider {
    static var previews: some View {
        let viewModel = MyViewModel()
        viewModel.state = .idle
        let viewModel2 = MyViewModel()
        viewModel2.state = .hasData
        let viewModel3 = MyViewModel()
        viewModel3.state = .error
        
        return Group {
            MyView(viewModel: viewModel)
            MyView(viewModel: viewModel2)
            MyView(viewModel: viewModel3)
        }
    }
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

更改 SwiftUI PreviewProvider 中的模型视图状态 的相关文章

随机推荐