SwiftUI TabView因NavigationLink层级问题导致编程切换失效

问题根源 #

自定义返回按钮使用presentationMode.dismiss()时，NavigationView的内部状态未与TabView正确同步——虽然viewRouter.currentView已更新（索引指示器变化），但TabView的视图层级未触发重新渲染，导致无法切换视图。

方案一：调整导航层级结构（推荐） #

将NavigationView从包裹整个TabView改为嵌入每个Tab内部，让每个Tab拥有独立的导航栈，返回操作不会干扰TabView的状态。

修改MainView代码：

struct MainView: View {
    
    @StateObject var viewRouter: ViewRouter = ViewRouter()
    
    var body: some View {
        VStack(spacing: 0) {
            TabView(selection: $viewRouter.currentView) {
                // Leaderboard Tab 独立导航栈
                NavigationView {
                    Text("Leaderboard")
                }
                .navigationViewStyle(StackNavigationViewStyle())
                .tag(Views.leaderboard)
                
                // Home Tab 独立导航栈
                NavigationView {
                    Text("Home")
                }
                .navigationViewStyle(StackNavigationViewStyle())
                .tag(Views.home)
                
                // PouleView 内部已包含NavigationLink，无需额外包裹
                PouleView()
                    .tag(Views.poules)
            }
            .tabViewStyle(.page(indexDisplayMode: .always))
            .ignoresSafeArea()
            
            // 底部自定义切换按钮
            VStack {
                HStack(alignment: .center, spacing: 30) {
                    Text("Leaderboard")
                        .foregroundColor(.black)
                        .onTapGesture {
                            viewRouter.changeView(destination: Views.leaderboard)
                        }
                    
                    Text("Home")
                        .foregroundColor(.black)
                        .onTapGesture {
                            viewRouter.changeView(destination: Views.home)
                        }
                    
                    Text("Poule")
                        .foregroundColor(.black)
                        .onTapGesture {
                            viewRouter.changeView(destination: Views.poules)
                        }
                }
            }
            .frame(maxWidth: .infinity)
        }
    }
}

方案二：强制TabView重新渲染 #

如果不想调整现有结构，可通过给TabView绑定id的方式，在currentView变化时强制TabView重新创建，触发视图切换。

修改MainView中的TabView部分：

TabView(selection: $viewRouter.currentView) {
    Text("Leaderboard")
        .tag(Views.leaderboard)
    
    Text("Home")
        .tag(Views.home)
    
    PouleView()
        .tag(Views.poules)
}
.tabViewStyle(.page(indexDisplayMode: .always))
.ignoresSafeArea()
.id(viewRouter.currentView) // 添加此行，强制TabView随currentView更新

优化自定义返回按钮（iOS15+） #

建议使用iOS15新增的@Environment(\.dismiss)替代旧的presentationMode，代码更简洁：

struct PouleDetailView: View {
    @Environment(\.dismiss) private var dismiss

    var body: some View {
        VStack {
            Button(action: {
                dismiss()
            }) {
               Text("Close")
            }
            Text("This is content")
        }
        .navigationBarTitle("",displayMode: .inline)
        .navigationBarBackButtonHidden(true)
        .navigationBarHidden(true)
    }
}

两种方案均可保留自定义返回按钮，同时解决TabView无法通过代码切换的问题。方案一更符合SwiftUI导航设计规范，避免导航栈冲突；方案二则是快速修复现有结构的临时方案。

内容的提问来源于stack exchange，提问作者Björn