从 SwiftUI 中的导航堆栈中删除屏幕答案

【问题标题】：Remove screen from navigation stack in SwiftUI从 SwiftUI 中的导航堆栈中删除屏幕
【发布时间】：2021-07-11 15:38:52
【问题描述】：

我使用NavigationLink 在NavigationView 中导航屏幕。如何从导航堆栈中删除屏幕？不只是隐藏导航“返回”按钮，而是完全从堆栈中移除屏幕？

例如，我有这样的屏幕链：A -> B -> C 如何删除屏幕B 以从C 返回到A？

或者，另一个例子，如何删除屏幕A和B，所以C屏幕将成为根？

或者这一切在 SwiftUI 的概念中是不可能的？

【问题讨论】：

请不要在一篇文章中提出一个以上的问题，这样会更难为您和其他人找到正确的答案来使用您的问题来学习或学习。
公平地说，如果从 UIKit 的角度来看，这将是一个概念。只是碰巧在 SwiftUI 中，它更有可能是两个独立的问题。

标签： swiftui swiftui-navigationlink swiftui-navigationview

【解决方案1】：

就您的第一个问题（从 C 到 A）而言，这通常被称为“弹出到根目录”，并且在 SO 上有许多解决方案，包括：https://stackoverflow.com/a/59662275/560942

您的第二个问题（将A 替换为C 作为根视图）有点不同。您可以通过在视图层次结构中将A 替换为C 来实现。为了做到这一点，您需要有某种方式与父视图进行通信——我选择了一个简单的@State/@Binding 来执行此操作，但可以使用ObservableObject 甚至回调函数来代替.

enum RootView {
    case A, C
}

struct ContentView : View {
    @State private var rootView : RootView = .A
    
    var body: some View {
        NavigationView {
            switch rootView {
            case .A:
                ViewA(rootView: $rootView)
            case .C:
                ViewC(rootView: $rootView)
            }
        }.navigationViewStyle(StackNavigationViewStyle())
    }
}

struct ViewA : View {
    @Binding var rootView : RootView
    
    var body: some View {
        VStack {
            Text("View A")
            NavigationLink(destination: ViewB(rootView: $rootView)) {
                Text("Navigate to B")
            }
        }
    }
}

struct ViewB : View {
    @Binding var rootView : RootView
    
    var body: some View {
        VStack {
            Text("View B")
            NavigationLink(destination: ViewC(rootView: $rootView)) {
                Text("Navigate to C")
            }
            Button(action: {
                rootView = .C
            }) {
                Text("Navigate to C as root view")
            }
        }
    }
}

struct ViewC : View {
    @Binding var rootView : RootView
    
    var body: some View {
        VStack {
            Text("View C")
            switch rootView {
            case .A:
                Button(action: {
                    rootView = .C
                }) {
                    Text("Switch this to the root view")
                }
            case .C:
                Text("I'm the root view")
            }
        }
    }
}

【讨论】：