SwiftUI：如何将ListView设为初始视图并保留导航栏及返回按钮

问题的核心在于：原来的NavigationView只存在于HomeView中，ListView本身并没有被纳入导航栈管理。当直接启动ListView时，它没有父级的NavigationView，自然不会显示导航栏和返回按钮。下面提供两种适配不同iOS版本的解决方案：

方法一：适配iOS 16+（推荐）：使用NavigationStack管理导航栈 #

iOS16引入的NavigationStack可以通过导航路径（Navigation Path）灵活控制初始显示的页面，同时自动维护导航栈的层级，这样返回按钮会自动出现：

步骤1：定义路由枚举 #

首先定义一个枚举来管理所有页面路由：

enum AppRoute: Hashable {
    case home
    case list
}

步骤2：在App入口配置初始导航路径 #

修改你的App主结构体，将NavigationStack作为根视图，并设置初始路径直接指向ListView：

@main
struct YourAppName: App {
    // 初始路径设置为包含list，启动时直接显示ListView
    @State private var navigationPath = [AppRoute.list]
    
    var body: some Scene {
        WindowGroup {
            NavigationStack(path: $navigationPath) {
                // 导航栈的根视图是HomeView
                HomeView()
                    .navigationDestination(for: AppRoute.self) { route in
                        switch route {
                        case .list:
                            ListView()
                        case .home:
                            HomeView()
                        }
                    }
            }
        }
    }
}

步骤3：更新HomeView的跳转逻辑 #

把原来的NavigationLink改成基于路由值的形式：

struct HomeView: View{
    var body: some View {
        ZStack {
            NavigationLink(value: AppRoute.list) {
                Text("跳转到列表页")
            }
        }
        .navigationTitle("首页")
    }
}

步骤4：ListView无需额外修改 #

因为它已经被纳入导航栈管理，返回按钮会自动显示：

struct ListView: View{
    var body: some View {
        ZStack {
            List {
                Text("列表项1")
                Text("列表项2")
                // 你的列表内容
            }
        }
        .navigationTitle("列表页")
    }
}

这样设置后，无论启动时显示HomeView还是ListView，导航栈都会正确维护层级，返回按钮也能正常工作。

方法二：适配iOS 15及以下：给ListView添加独立NavigationView并自定义返回逻辑 #

如果你需要兼容iOS15及更早版本，可以给ListView单独包裹NavigationView，并通过判断当前是否为根视图来显示对应的返回按钮：

struct ListView: View {
    // iOS15及以下用presentationMode，iOS16+可以用dismiss
    @Environment(\.presentationMode) private var presentationMode
    @State private var isRootView = false
    
    var body: some View {
        NavigationView {
            ZStack {
                List {
                    Text("列表项1")
                    Text("列表项2")
                }
            }
            .navigationTitle("列表页")
            .navigationBarItems(leading: backButton)
        }
        .onAppear {
            // 判断当前视图是否为导航栈的根视图
            if let windowScene = UIApplication.shared.connectedScenes.first as? UIWindowScene,
               let navController = windowScene.windows.first?.rootViewController as? UINavigationController {
                isRootView = navController.viewControllers.count == 1
            }
        }
    }
    
    // 自定义返回按钮逻辑
    private var backButton: some View {
        Group {
            if isRootView {
                // 如果是初始视图，点击后切换根视图回到HomeView
                Button(action: {
                    if let windowScene = UIApplication.shared.connectedScenes.first as? UIWindowScene,
                       let window = windowScene.windows.first {
                        window.rootViewController = UIHostingController(rootView: HomeView())
                    }
                }) {
                    HStack {
                        Image(systemName: "chevron.left")
                        Text("返回首页")
                    }
                }
            } else {
                // 如果是从HomeView跳转过来的，显示默认返回按钮
                Button(action: {
                    presentationMode.wrappedValue.dismiss()
                }) {
                    Image(systemName: "chevron.left")
                }
            }
        }
    }
}

这种方式下，当ListView作为初始视图时会显示自定义的返回首页按钮，从HomeView跳转过来时则显示默认的返回按钮，同时导航栏也能正常显示。

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