SwiftUI：如何在NavigationLink标题与箭头/披露指示器间添加文本

你想要实现示例图左侧的效果，在NavigationLink的标题和箭头（披露指示器）之间加入文本，直接把Text放在NavigationLink外面的HStack里会导致文本出现在箭头右侧，不符合需求。正确的做法是自定义NavigationLink的label内容：

修改后代码 #

struct NavigationStackTest: View {
    let fruits = ["Orange", "Apple"]
    var body: some View {
        NavigationStack{
            List(fruits, id:\.self){ fruit in
                // 自定义NavigationLink的label内容
                NavigationLink(value: fruit) {
                    HStack {
                        Text(fruit) // 原标题文本
                        Spacer() // 利用间隔把"Details"推到右侧
                        Text("Details") // 要插入的文本
                        // 系统会自动在label末尾添加披露指示器，无需手动添加
                    }
                }
            }
            .navigationDestination(for: String.self) { item in
                Text(verbatim: item)
            }
        }
    }
}

原理说明 #

默认的NavigationLink(title:value:)初始化器会把标题作为label，系统自动在label末尾追加披露指示器。通过自定义label，我们可以把原标题和需要插入的文本放在同一个HStack中，借助Spacer()将插入文本定位到靠近箭头的位置，从而实现标题与箭头之间显示指定文本的效果。

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