SwiftUI：移除列表单元格中NavigationLink默认显示的Chevron

问题分析 #

你之前的方法无效，是因为List会自动为包含NavigationLink的单元格添加默认的Chevron箭头——即便你把NavigationLink设为透明，系统依然能检测到单元格内存在NavigationLink，所以箭头还是会显示。

解决方案 #

方案一：iOS 16+ 推荐使用 NavigationStack + navigationDestination #

这种方式完全脱离传统NavigationLink的限制，不会生成任何默认箭头，灵活性更高：

import SwiftUI

struct ContentView: View {
    @State private var shouldShowNotes = false
    
    var body: some View {
        NavigationStack {
            List {
                ZStack {
                    HStack {
                        Text("1")
                        Spacer()
                    }
                    
                    HStack {
                        Spacer()
                        Text("2")
                            .multilineTextAlignment(.center)
                            .frame(alignment: .center)
                        Spacer()
                    }
                    
                    HStack {
                        Spacer()
                        // 用普通Button触发跳转，无默认箭头
                        Button("Notes") {
                            shouldShowNotes = true
                        }
                        .fixedSize()
                    }
                }
            }
            // 绑定跳转状态和目标页面
            .navigationDestination(isPresented: $shouldShowNotes) {
                NotesView()
            }
        }
    }
}

方案二：iOS 16+ 直接隐藏NavigationLink箭头 #

如果仍想使用NavigationLink，可以通过环境变量直接关闭箭头显示：

import SwiftUI

struct ContentView: View {
    var body: some View {
        NavigationStack {
            List {
                ZStack {
                    HStack {
                        Text("1")
                        Spacer()
                    }
                    
                    HStack {
                        Spacer()
                        Text("2")
                            .multilineTextAlignment(.center)
                            .frame(alignment: .center)
                        Spacer()
                    }
                    
                    HStack {
                        Spacer()
                        NavigationLink(destination: NotesView()) {
                            Text("Notes")
                        }
                        .fixedSize()
                        // 关闭箭头显示
                        .environment(\.showNavigationLinkChevron, false)
                    }
                }
            }
        }
    }
}

方案三：兼容iOS 13+ 的传统写法 #

把NavigationLink放在ZStack最底层设为透明，同时让自定义内容覆盖其上，确保跳转触发区域符合需求：

import SwiftUI

struct ContentView: View {
    var body: some View {
        NavigationView {
            List {
                ZStack {
                    // 底层透明的NavigationLink，无可见内容
                    NavigationLink(destination: NotesView()) {
                        EmptyView()
                    }
                    .opacity(0)
                    
                    // 自定义单元格内容
                    HStack {
                        Text("1")
                        Spacer()
                    }
                    
                    HStack {
                        Spacer()
                        Text("2")
                            .multilineTextAlignment(.center)
                            .frame(alignment: .center)
                        Spacer()
                    }
                    
                    HStack {
                        Spacer()
                        Text("Notes")
                            .fixedSize()
                    }
                }
                // 让整个单元格区域都能触发跳转（若只想让Notes可点击则移除该行）
                .contentShape(Rectangle())
            }
        }
    }
}

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