当指向第三个视图的导航链接嵌入到导航栏按钮中时，SwiftUI 导航无法按预期使用 3 个视图

Question

我是一名新手 Xcode/SwiftUI 开发人员，一直被困在以下与导航相关的问题上。在以下最小的、可重现的示例中，我希望用户能够在到达 ThirdView 后逐个视图地向后导航应用程序，如下所示：ThirdView -> SecondView -> FirstView（或 ContentView，在下面的示例中）。

当 SecondView 中到达 ThirdView 的 NavigationLink 位于 SecondView 的正文中时，一切都按预期进行。（这是我在下面的示例中注释掉的 SecondView 代码。）但是，如果我将相同的 NavigationLink 向上移动到导航栏（如图所示），则单击 ThirdView 中的“返回第二个视图”栏按钮不会执行任何操作.观点没有改变。有没有一种方法可以通过栏按钮中的导航 link 从 SecondView -> ThirdView 导航，但仍然能够从 ThirdView -> SecondView 向后导航？

我已经在网上阅读了一些此类问题的问答，这些问题表明此问题是 Xcode 模拟器中的一个小故障，但是当我在我的设备上加载该应用程序时，我有同样的问题。

struct ContentView: View {
    @State private var activeLink: Bool = false
    var body: some View {
        NavigationView {
            VStack {
                Spacer()
                NavigationLink("Show Second Screen",
                    destination: SecondView(active: $activeLink), isActive: $activeLink)
                Spacer()
            }.padding()
            .navigationBarTitle("First view")
        }
    }
}

struct SecondView: View {
    @Binding var active: Bool
    @State private var thirdViewLink: Bool = false
    
    var body: some View {
        VStack {
        Spacer()
    // This works as expected but is not ideal for my purposes
     /* NavigationLink("Show Third View",
            destination: ThirdView(thirdViewActive: $thirdViewLink), isActive: $thirdViewLink) */
        Spacer()
        }.padding()
        .navigationBarTitle("Second View")
        .navigationBarBackButtonHidden(true)
        .navigationBarItems(leading: Button("Back to 1st View") {
            self.active = false
        }, trailing: NavigationLink("Show Third View",
                                    destination: ThirdView(thirdViewActive: $thirdViewLink),
                                    isActive: $thirdViewLink))
    }
}

struct ThirdView: View {
    @Binding var thirdViewActive: Bool
    var body: some View {
        VStack(spacing: 15) {
            Text("Third View")
            Spacer()
        }.padding()
        .navigationBarItems(leading: Button("Back to 2nd View") {
            self.thirdViewActive = false
        })
    }
}

Answer 1

问题是您的 NavigationView 之外有一个 NavigationLink。

.navigationBarItems(leading: Button("Back to 1st View") {
    self.active = false
}, trailing: NavigationLink( /// this is not inside your NavigationView!
    "Show Third View",
    destination: ThirdView(thirdViewActive: $thirdViewLink),
    isActive: $thirdViewLink
)

这行不通，您会运行遇到奇怪的问题。 NavigationLink 总是需要在 NavigationView 内。您应该按照 “这按预期工作，但对我的目的来说并不理想”的方法进行操作，然后传入 EmptyView 来隐藏它。

struct SecondView: View {
    @Binding var active: Bool
    @State private var thirdViewLink: Bool = false
    
    var body: some View {
        VStack {
            Spacer()
            // This works as expected but is not ideal for my purposes
            NavigationLink(destination: ThirdView(thirdViewActive: $thirdViewLink), isActive: $thirdViewLink) {
                EmptyView()
            }
            Spacer()
        }.padding()
        .navigationBarTitle("Second View")
        .navigationBarBackButtonHidden(true)
        .navigationBarItems(leading: Button("Back to 1st View") {
            self.active = false
        }, trailing:
            Button("Show Third View") {
                self.thirdViewLink = true
            }
        )
    }
}

当指向第三个视图的导航链接嵌入到导航栏按钮中时，SwiftUI 导航无法按预期使用 3 个视图

SwiftUI Navigation does not work as expected with 3 views when navigationLink to third view is embedded in a navigationBar button

xcode

swiftui-navigationlink

navigationbaritems