如何在NavigationSplitView中保留各NavigationStack的导航路径？

核心问题是切换侧边栏选项时，对应NavigationStack视图被销毁重建，导致导航路径丢失。通过将所有标签的导航路径统一托管到一个ObservableObject中，确保状态在视图生命周期外持续保留，就能解决这个问题。

步骤1：定义导航状态管理类 #

创建一个可观察对象来存储每个标签的NavigationPath，并提供根据标签获取对应路径绑定的方法：

import SwiftUI

class TabNavigationManager: ObservableObject {
    @Published var tab1Path = NavigationPath()
    @Published var tab2Path = NavigationPath()
    @Published var tab3Path = NavigationPath()
    @Published var tab4Path = NavigationPath()
    
    func path(for tab: Tab) -> Binding<NavigationPath> {
        switch tab {
        case .tab1: return $tab1Path
        case .tab2: return $tab2Path
        case .tab3: return $tab3Path
        case .tab4: return $tab4Path
        }
    }
}

// 定义标签枚举，统一管理侧边栏选项
enum Tab: CaseIterable, Identifiable {
    case tab1, tab2, tab3, tab4
    
    var id: Self { self }
    var title: String {
        switch self {
        case .tab1: return "首页"
        case .tab2: return "分类"
        case .tab3: return "我的"
        case .tab4: return "设置"
        }
    }
}

步骤2：构建根视图 #

在根视图中使用@StateObject持有导航状态，绑定侧边栏选中项，并在详情区域渲染对应标签的NavigationStack：

struct RootView: View {
    @StateObject private var navManager = TabNavigationManager()
    @State private var selectedTab: Tab = .tab1
    
    var body: some View {
        NavigationSplitView {
            List(Tab.allCases, selection: $selectedTab) { tab in
                Text(tab.title)
            }
            .navigationTitle("菜单")
        } detail: {
            switch selectedTab {
            case .tab1:
                Tab1View(path: navManager.path(for: .tab1))
            case .tab2:
                Tab2View(path: navManager.path(for: .tab2))
            case .tab3:
                Tab3View(path: navManager.path(for: .tab3))
            case .tab4:
                Tab4View(path: navManager.path(for: .tab4))
            }
        }
    }
}

步骤3：实现标签页视图 #

每个标签页视图接收对应的路径绑定，用NavigationStack包裹内容并绑定路径，确保导航跳转状态被持久化：

// 示例标签页视图
struct Tab1View: View {
    @Binding var path: NavigationPath
    
    var body: some View {
        NavigationStack(path: $path) {
            List {
                NavigationLink("查看详情1", value: DetailItem(id: 1))
                NavigationLink("查看详情2", value: DetailItem(id: 2))
            }
            .navigationTitle("首页")
            .navigationDestination(for: DetailItem.self) { item in
                DetailView(item: item)
            }
        }
    }
}

// 示例详情页及数据模型
struct DetailItem: Hashable {
    let id: Int
}

struct DetailView: View {
    let item: DetailItem
    
    var body: some View {
        Text("详情页面 \(item.id)")
            .navigationTitle("详情 \(item.id)")
    }
}

关键说明 #

• @StateObject确保导航状态不会随视图销毁而丢失，生命周期与根视图一致
• 每个NavigationStack绑定到对应标签的路径，切换侧边栏时，路径状态被完整保留，重建的NavigationStack会自动恢复之前的导航位置
• 标签枚举统一管理侧边栏选项，避免硬编码，提高可维护性

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