SwiftUI - 子类视图模型不会触发视图刷新

Question

我有这种情况，我有一个包含一些常用元素的 BaseView 和一个包含一些常用功能的 BaseViewModel，但是当它的 @Published var 得到更新时，没有 BaseView 刷新发生。

设置是这样的：

class BaseViewModel: ObservableObject {

    @Published var overlayView: AnyView = EmptyView().convertToAnyView()

    func forceViewRefresh() {
        self.objectWillChange.send()
    }

    func setOverlayView(overlayView: AnyView) {
        self.overlayView = overlayView
    }

}

这个视图模型子类BaseViewModel：

class FirstViewModel: BaseViewModel {
    func showOverlayView() {
        self.setOverlayView(overlayView: OverlayView().convertToAnyView())
    }
}

我还有一个BaseView，我使用overlayView

struct BaseView<Content: View>: View {

let content: Content
@ObservedObject var viewModel = BaseViewModel()

init(content: () -> Content) {
    self.content = content()
}

var body: some View {
    
    ZStack {
        Color.green.edgesIgnoringSafeArea(.vertical)
        content
        viewModel.overlayView
    }
    
}

}

显示的第一个视图是 FirstView，它符合 BaseViewProtocol 并具有扩展 BaseViewModel 的 FirstViewModel。

struct FirstView: BaseViewProtocol {

@ObservedObject var viewModel = FirstViewModel()

var body: some View {
    
    BaseView() {
        
        Button("Show overlay") {
            viewModel.showOverlayView()
        }
    } 
}

}

单击First View 中的Show overlay 按钮会调用FirstViewModel 上的showOverlayView() 函数，后者又会调用BaseViewModel 上的setOverlayView。 BaseViewModel 中的 overlayView 的值按预期更改，但不会调用 FirstView 上的视图刷新。 我做错了什么？

非常感谢。

Answer 1

我刚刚测试了这个代码示例，并且在 Xcode 12 beta 6 和 iOS 14 beta 8 上运行良好

struct ContentView: View {
    
    @StateObject private var viewModel = FirstViewModel()
    
    var body: some View {
        ZStack {
            Button(action: { viewModel.showOverlayView() }) {
                Text("Press")
            }
            viewModel.overlayView
        }
    }
}

class BaseViewModel: ObservableObject {
    
    @Published var overlayView: AnyView = AnyView(EmptyView())
    
    func forceViewRefresh() {
        self.objectWillChange.send()
    }
    
    func setOverlayView(overlayView: AnyView) {
        self.overlayView = overlayView
    }
    
}

class FirstViewModel: BaseViewModel {
    func showOverlayView() {
        self.setOverlayView(
            overlayView: AnyView(
                Color.blue
                    .opacity(0.2)
                    .allowsHitTesting(false)
            )
        )
    }
}

Answer 2

通常在 SwiftUI 中，您不会在 body 之外创建视图。视图创建应该留给 SwiftUI - 相反，您可以定义一些其他控件来告诉 SwiftUI 如何 和 何时 创建视图。

这是一个简化的演示，如何为不同的视图呈现不同的叠加层。

您可以创建一个基本的 OverlayView：

enum OverlayType {
    case overlay1, overlay2
}

struct OverlayView: View {
    let overlayType: OverlayType

    @ViewBuilder
    var body: some View {
        if overlayType == .overlay1 {
            Text("Overlay1") // can be replaced with any view you want
        }
        if overlayType == .overlay2 {
            Text("Overlay1")
        }
    }
}

并在您的 BaseView 中使用它（如果 overlayType 是 nil，则不会显示叠加层）：

struct BaseView<Content>: View where Content: View {
    let overlayType: OverlayType?
    let content: () -> Content

    var body: some View {
        ZStack {
            Color.green.edgesIgnoringSafeArea(.vertical)
            content()
            if overlayType != nil {
                OverlayView(overlayType: overlayType!)
            }
        }
    }
}

现在您可以在 ContentView 中使用 BaseView 并指定其 OverlayType。

struct ContentView: View {
    @State var overlayType: OverlayType?

    var body: some View {
        BaseView(overlayType: overlayType) {
            Button("Show overlay") {
                overlayType = .overlay1
            }
        }
    }
}

---

一些注意事项：

• 为简单起见，我使用@State 变量来控制覆盖。如果您的 ViewModel 有其他用例，您可能希望将逻辑移到那里。

• 请注意，最好使用@ViewBuilder，而不是AnyView。

• 另外，如果你想在视图中观察ObservableObject，你需要使用@ObservedObject，而不是@ObservableObject。