SwiftUI导航时导航标题不显示问题求助

问题根源 #

你遇到的问题是导航栈嵌套冲突导致的：从欢迎界面通过.navigationDestination导航到TabNavigation时，TabNavigation已经处于外层的导航栈中，但你在OverviewScreen内部又嵌套了一个NavigationStack，这会让SwiftUI的导航层级混乱，首次加载时无法正确渲染导航标题和工具栏，只有后台切换后View树重新计算才会临时恢复。

解决方案 #

核心是移除子View中的嵌套NavigationStack，让外层导航栈统一管理导航元素（标题、工具栏）。以下是具体修改步骤：

1. 重构OverviewScreen，移除内部NavigationStack #

将导航标题、toolbar移到父View（TabNavigation）中，同时通过Binding传递弹窗触发状态：

struct OverviewScreen: View {
    @StateObject private var viewModel: OverviewViewModel = OverviewViewModel()
    @Binding var navigateToAddPillScreen: Bool

    var body: some View {
        mainView
            .sheet(isPresented: $navigateToAddPillScreen) {
                AddPillScreen {
                    viewModel.getPills()
                    navigateToAddPillScreen.toggle()
                }
            }
            .onAppear {
                viewModel.getPills()
            }
    }

    @ViewBuilder private var mainView: some View {
        if viewModel.viewState.isListEmpty {
            EmptyListView()
        } else {
            List {
                Section("today") {
                    ForEach(viewModel.pills, id: \.id) { pill in
                        PillItem(pill: pill)
                    }
                }
            }
        }
    }
}

2. 修改TabNavigation，接管导航元素 #

在对应Tab项上添加导航标题和工具栏，并维护弹窗触发状态：

struct TabNavigation: View {
    @State private var navigateToAddPillScreen = false

    var body: some View {
        TabView {
            OverviewScreen(navigateToAddPillScreen: $navigateToAddPillScreen)
                .tabItem {
                    Image(systemName: "list.bullet.clipboard")
                    Text("overview")
                }
                .navigationTitle("overview")
                .toolbar {
                    ToolbarItem {
                        AddPillButton {
                            navigateToAddPillScreen.toggle()
                        }
                    }
                }
            SettingsScreen()
                .tabItem {
                    Image(systemName: "gear")
                    Text("settings")
                }
        }
        .navigationBarBackButtonHidden(true)
        .accentColor(.black)
    }
}

3. 保持欢迎界面的导航代码不变 #

.navigationDestination(isPresented: $navigateToOverviewScreen) {
    TabNavigation()
}

原理说明 #

SwiftUI的NavigationStack是层级式管理的，当你通过.navigationDestination跳转时，目标View自动加入当前导航栈。嵌套NavigationStack会导致系统无法正确识别当前活跃的导航层级，从而跳过标题和工具栏的渲染。移除嵌套后，外层导航栈可以正确处理所有导航元素，首次加载即可正常显示。

内容的提问来源于stack exchange，提问作者MACROSystems