SwiftUI中如何在单个列表行内使用多个NavigationLink？

需求：点击“Hello”按钮跳转至HelloWorldView，点击“Bye”按钮跳转至ByeWorldView。由于iOS 16.2后NavigationLink的isActive属性已被弃用，需要采用新的实现方式。

优化后的实现代码 #

推荐使用类型安全的枚举定义导航目标，结合NavigationStack的路径绑定实现程序化导航，避免字符串判断的潜在问题：

import SwiftUI

// 定义导航目标枚举，提升类型安全性
enum NavTarget: Hashable {
    case hello
    case bye
}

struct ContentView: View {
    // 绑定NavigationStack的导航路径
    @State private var navPath = [NavTarget]()
    
    var body: some View {
        NavigationStack(path: $navPath) {
            ListView(navPath: $navPath)
            // 统一注册所有导航目标
            .navigationDestination(for: NavTarget.self) { target in
                switch target {
                case .hello:
                    HelloWorldView()
                case .bye:
                    ByeWorldView()
                }
            }
        }
    }
}

struct ListView: View {
    @Binding var navPath: [NavTarget]
    
    var body: some View {
        List {
            RowView(navPath: $navPath)
            RowView(navPath: $navPath)
            RowView(navPath: $navPath)
        }
    }
}

struct RowView: View {
    @Binding var navPath: [NavTarget]
    
    var body: some View {
        HStack {
            Button("Bye") {
                navPath.append(.bye)
            }
            Button("Hello") {
                navPath.append(.hello)
            }
        }
    }
}

struct HelloWorldView: View {
    var body: some View {
        Text("Hello, World!")
    }
}

struct ByeWorldView: View {
    var body: some View {
        Text("Bye, World!")
    }
}

核心改进说明 #

• 用枚举NavTarget替代字符串标识导航目标，彻底避免拼写错误，代码更健壮
• 在NavigationStack层级统一注册navigationDestination，解决原代码中每个RowView重复注册导致的导航冲突问题
• 通过绑定navPath数组实现程序化导航，点击按钮时将对应枚举值追加到路径中，自动触发跳转
• 无需隐藏的NavigationLink，代码结构更简洁直观

实现后，点击“Hello”按钮会跳转到显示Hello, World!的视图，点击“Bye”按钮跳转到显示Bye, World!的视图，返回按钮可正常返回上级页面。

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