SwiftUI：删除后更新 NavigationView (iPad)

Question

我想在 iPad 上删除一行后显示 空视图（此处：Text("Please select a person.")）。

目前： iPad 上的详细视图在删除项目后不会更新。 预期：在所选项目被删除后显示空视图。

struct DetailView: View {
    var name: String
    var body: some View {
        Text("Detail of \(name)")
    }
}

struct MainView: View {
    @State private var users = ["Paul", "Taylor", "Adele"]

    var body: some View {
        NavigationView {
            List {
                ForEach(users, id: \.self) { user in
                    NavigationLink(destination: DetailView(name: user)) {
                        Text(user)
                    }
                }
                .onDelete(perform: delete)
            }
            Text("Please select a person.")
        }
    }

    func delete(at offsets: IndexSet) {
        users.remove(atOffsets: offsets)
    }
}

来自Hacking With Swift的NavigationView示例。

在下面的示例中，详细视图在第一次启动后正确显示：here

但删除一行后，之前选择的详细视图（这里：Paul）仍然显示：here

Answer 1

从 iOS 14 开始，似乎不支持从导航视图的列表中删除元素。

NavigationLink 类型采用 isActive 绑定，但在删除的情况下不起作用。当您收到.onDelete 回调时，为时已晚。 NavigationLink 不再在列表中，对您传递给它的绑定的任何更改都不会产生任何影响。

解决方法是将所有元素的绑定传递给DetailView，以便它可以验证元素是否存在并相应地显示一些内容。

struct DetailView: View {
    var name: String
    @Binding var users: [String]

    var body: some View {
        if users.contains(name) {
            Text("Detail of \(name)")
        } else {
            EmptyView()
        }
    }
}

struct MainView: View {
    @State private var users = ["Paul", "Taylor", "Adele"]

    var body: some View {
        NavigationView {
            List {
                ForEach(users, id: \.self) { user in
                    NavigationLink(destination: DetailView(name: user, users: $users)) {
                        Text(user)
                    }
                }
                .onDelete(perform: delete)
            }
        }
    }

    func delete(at offsets: IndexSet) {
        users.remove(atOffsets: offsets)
    }
}

Answer 2

您可以使用父视图的绑定来手动触发重新渲染（否则子视图不会收到通知）：

import SwiftUI

struct DetailView: View {
  var name: String
  @Binding var notifier: Int
  @State var deleted: Bool = false
  
  var body: some View {
    Group {
      if !deleted {
        Text("Detail of \(name)")
          .onChange(of: notifier, perform: { _ in deleted = true })
      } else {
        Text("Deleted")
      }
    }
  }
}

struct MainView: View {
  @State private var users = ["Paul", "Taylor", "Adele"]
  @State private var deleteNotifier: Int = 0

  var body: some View {
    NavigationView {
      List {
        ForEach(users, id: \.self) { user in
          NavigationLink(destination: DetailView(name: user,
                                                 notifier: $deleteNotifier)) {
            Text(user)
          }
        }
        .onDelete(perform: delete)
      }
      Text("Please select a person.")
    }
  }

  func delete(at offsets: IndexSet) {
    users.remove(atOffsets: offsets)
    deleteNotifier += 1
  }
}

Answer 3

您可以使用第二个选项来更新列表：index。这样会加强清爽：

    var body: some View {
    NavigationView {
        List {
            ForEach(users.indices, id: \.self) { index in
                NavigationLink(destination: DetailView(name: self.users[index])) {
                    Text(self.users[index])
                }
            }
            .onDelete(perform: delete)
        }
        Text("Please select a person.")
    }
    }