SwiftUI/iOS 15：fullScreenCover 不会通过绑定已发布的 var 来解除

Question

我的应用程序使用 SwiftUI，以 iOS 15+ 为目标，并由 ObservableObject、AppState 管理，作为整个应用程序的真实来源。我使用@Published vars 来管理各个地方的覆盖状态（例如，加载数据时）没有问题。

简体AppState：

class AppState:ObservableObject {
  @Published var showLoadingOverlay = false

  func loadData() {
    self.showLoadingOverlay = true
    // fech data
    self.showLoadingOverlay = false
  }
}

在视图中，我通过@EnvironmentObject 注入AppState 并使用发布的变量来控制fullScreenCover。

简化示例：

struct MyDataView:View {
  @EnvironmentObject var state:AppState

  var body: some View {
    ScrollView {
      VStack {
        ForEach(Array(zip(state.dataSets.indices, state.dataSets)), id: \.0) { (dataSetIndex, dataSet) in
          MirrorChartView(dataSet: dataSet)
        }
      }
    }
    .onAppear {
      state.loadData()
    }
    .fullScreenCover(isPresented: $state.showLoadingOverlay) {
      LoadingOverlay()
    }
  }
}

问题我遇到的是在绑定值更改为false 时仍然显示一个叠加层。这种“卡住”仅发生在loadData() 完成速度非常快并且覆盖在完全显示之前实际上会被关闭的情况。

在视图中添加调试监视器确认与AppState 的绑定已正确传播：

struct MyDataView:View {
  @EnvironmentObject var state:AppState

  var body: some View {
    VStack {
      // draw stuff
    }
    .onAppear {
      state.loadData()
    }
    .onChange(of: state.showLoadingOverlay) { showOverlay in
      print("show overlay: \(showOverlay)")
    }
    .fullScreenCover(isPresented: $state.showLoadingOverlay) {
      LoadingOverlay()
    }
  }
}

即当覆盖层向上滑动时，我可以看到日志show overlay: false，但它不会被关闭。

即使通过 @State 本地绑定添加间接也不能可靠地解决问题：

struct MyDataView:View {
  @EnvironmentObject var state:AppState
  @State var showLoadingOverlay = false

  var body: some View {
    VStack {
      // draw stuff
    }
    .onAppear {
      state.loadData()
    }
    .onChange(of: state.showLoadingOverlay) { showOverlay in
      self.showLoadingOverlay = showOverlay
    }
    .fullScreenCover(isPresented: self.$showLoadingOverlay) {
      LoadingOverlay()
    }
  }
}

更新：更多测试表明，即使就地绑定为 false 也不会关闭 fullScreenCover：

将状态绑定替换为就地自定义绑定显示我的状态已正确传播并导致视图更新。但是，工作表仍然存在。

struct MyDataView:View {
  @EnvironmentObject var state:AppState

  var body: some View {
    VStack {
      // draw stuff
    }
    .onAppear {
      state.loadData()
    }
    .fullScreenCover(isPresented: .init(
      get: {
        print("recomputing binding: \(state.showOverlay)")
        return state.showOverlay
      }, set: { newValue in
        state.showOverlay = newValue
      }
    )) {
      LoadingOverlay()
    }
  }
}

这导致以下日志消息年表：

recomputing binding: false
recomputing binding: true
recomputing binding: false

更新：进一步的发现

我不知道该怎么做，但是在LoadingOverlay 的.onAppear() 中添加一条日志消息显示，它出现在之后绑定已更改为false：

struct MyDataView:View {
  @EnvironmentObject var state:AppState

  var body: some View {
    ScrollView {
      VStack {
        ForEach(Array(zip(state.dataSets.indices, state.dataSets)), id: \.0) { (dataSetIndex, dataSet) in
          MirrorChartView(dataSet: dataSet)
        }
      }
    }
    .onAppear {
      state.loadData()
    }
    .onChange(of: state.showLoadingOverlay) { show in
      print("show loading overlay \(show)")
    }
    .fullScreenCover(isPresented: $state.showLoadingOverlay) {
      LoadingOverlay()
        .onAppear {
          print("loading overlay appears")
        }
    }
  }
}

这导致以下日志消息年表：

show loading overlay: true
show loading overlay: false
loading overlay appears

有什么方法可以解决这个问题？

Answer 1

尝试在LoadingOverlay 的onAppear() 中加载数据。这样一来，您就可以延迟加载，并且可以防止导致问题的任何条件：

import SwiftUI

class AppState: ObservableObject {
    @Published var showLoadingOverlay = false
    
    func loadData() {
        //load data
        DispatchQueue.main.asyncAfter(deadline: .now() + 0.5) {
            self.showLoadingOverlay = false
        }
    }
}

struct LoadingOverlay: View {
    @EnvironmentObject var state: AppState
    var body: some View {
        VStack {
            Text("Loading")
        }
        .onAppear {
            state.loadData()
        }
    }
}

struct ContentView: View {
    @StateObject var state = AppState()
    var body: some View {
        VStack {
            Text("Data View")
        }
        .onAppear {
            state.showLoadingOverlay = true
        }
        
        .fullScreenCover(isPresented: $state.showLoadingOverlay) {
            LoadingOverlay()
        }
        .environmentObject(state)
    }
}