在 SwiftUI 中导航到不同的视图

Question

在我下面的示例代码中，我有两个选项卡，并且在主选项卡（选项卡 A）的首页上有两个“按钮”，允许用户导航到两个视图（视图 1 或视图 2）使用导航链接。在每个视图 1 和视图 2 中都有更多的导航链接，因此当您切换选项卡然后 return 切换到选项卡时，我的代码（有目的地）重置每个视图的导航堆栈。此外，如果您导航到视图 1 或视图 2（同时仍在主选项卡（选项卡 A）上），再次点击主选项卡按钮（选项卡 A）会将您带回首页（显示两个按钮）。这种行为正是我所需要的。我现在遇到的问题是导航链接（查看 1 和查看 2）无法按预期工作。有时单击视图 1 按钮会将您带到视图 2，有时它会将您带到视图 1。视图 2 按钮也会发生同样的情况。这一定与我如何为其他需要重置导航堆栈有关，但我不确定如何解决这个问题。我包含了一些最少的代码来展示这一点。有谁知道如何解决这个问题？谢谢

struct ContentView: View {

@State var activeView: Int = 0
@State var showNavigation: Bool = false


let items = ["View1", "View2"]


var body: some View {
    TabView(selection: Binding<Int> (
                get: {
                    activeView
                }, set: {
                    activeView = [=10=]
                    showNavigation = false
                   
                }))
    {
        NavigationView {
                        HStack {
                            VStack {
                            NavigationLink(
                                destination: View1(), isActive: $showNavigation, label: {
                                    Rectangle()
                                        .fill(Color.red)
                                .cornerRadius(12)
                                .frame(width: 70, height: 70)
                                }).isDetailLink(false)
                                
                        Text(items[0])
                            
                            }
                            
                            VStack{
                                NavigationLink(
                                    destination: View2(), isActive: $showNavigation, label: {
                                        Rectangle()
                                            .fill(Color.red)
                                    .cornerRadius(12)
                                    .frame(width: 70, height: 70)
                                    }).isDetailLink(false)
                                    
                            Text(items[1])
                                
                            }
                            
        
            }.navigationTitle("")
            .navigationBarHidden(true)
                                      }
                                     .tabItem {
                                        Image(systemName: "a.circle")
                                                        Text("Main")
                                      }
                                      .tag(0)
                                      
                                      View3()
                                      .padding()
                                      .tabItem {
                                          Image(systemName: "b.circle")
                                          Text("View 3")
                                      }
                                      .tag(1)
                                  }

}

}

Answer 1

问题似乎是您对 both NavigationLinks.

使用相同的 showNavigation 变量

我稍微更改了变量以保存 id 并添加了自定义 Binding 以跟踪哪个 NavigationLink 应该处于活动状态：


struct ContentView: View {
    
    @State var activeView: Int = 0
    @State var activeNavigationLink: Int = 0 //<-- Here
    
    let items = ["View1", "View2"]
    
    func navigationLinkBinding(id: Int) -> Binding<Bool> {  //<-- Here
        .init { () -> Bool in
            activeNavigationLink == id
        } set: { (newValue) in
            if newValue {
                activeNavigationLink = id
            } else {
                activeNavigationLink = 0
            }
        }
    }
    
    var body: some View {
        TabView(selection: Binding<Int> (
                    get: {
                        activeView
                    }, set: {
                        activeView = [=10=]
                        activeNavigationLink = 0  //<-- Here
                    }))
        {
            NavigationView {
                HStack {
                    VStack {
                        NavigationLink(
                            destination: Text("View 1"), isActive: navigationLinkBinding(id: 1), label: {  //<-- Here
                                Rectangle()
                                    .fill(Color.red)
                                    .cornerRadius(12)
                                    .frame(width: 70, height: 70)
                            }).isDetailLink(false)
                        
                        Text(items[0])
                        
                    }
                    
                    VStack{
                        NavigationLink(
                            destination: Text("View 2"), isActive: navigationLinkBinding(id: 2), label: {  //<-- Here
                                Rectangle()
                                    .fill(Color.red)
                                    .cornerRadius(12)
                                    .frame(width: 70, height: 70)
                            }).isDetailLink(false)
                        
                        Text(items[1])
                        
                    }
                    
                    
                }.navigationTitle("")
                .navigationBarHidden(true)
            }
            .tabItem {
                Image(systemName: "a.circle")
                Text("Main")
            }
            .tag(0)
            
            Text("View 3")
                .padding()
                .tabItem {
                    Image(systemName: "b.circle")
                    Text("View 3")
                }
                .tag(1)
        }
        
    }
}

在 SwiftUI 中导航到不同的视图

Navigating to different views within SwiftUI

swiftui

navigationview

tabview

swiftui-navigationlink