SwiftUI中如何在ForEach循环内优雅添加Divider()

方法1：提取重复视图，简化条件判断 #

把重复的NavigationLink部分提取成独立的子视图，循环中先渲染该视图，再仅对非最后一项添加Divider，彻底消除代码重复：

struct ContentView: View {
    
    fileprivate struct Detail: Identifiable, Equatable {
        let name: String
        let image: String
        var id: String { name }
    }
    
    private let details: [Detail] = [
        Detail(name: "arrow", image: "arrow.clockwise"),
        Detail(name: "car", image: "car"),
        Detail(name: "clipboard", image: "doc.on.clipboard")
    ]
    
    // 提取重复的NavigationLink为子视图
    private func detailLink(for detail: Detail) -> some View {
        NavigationLink {
            EmptyView()
        } label: {
            ContentLabelHelpView(name: detail.name, image: detail.image)
        }
    }
    
    var body: some View {
        NavigationView {
            VStack(alignment: .leading, spacing: 24) {
                ForEach(details, id: \.name) { detail in
                    detailLink(for: detail)
                    // 仅在非最后一项后添加Divider
                    if detail != details.last {
                        Divider()
                    }
                }
            }
            .padding()
        }
    }
}

fileprivate struct ContentLabelHelpView: View {
    let name: String
    let image: String
    
    var body: some View {
        VStack(alignment: .leading) {
            HStack(alignment: .firstTextBaseline) {
                Image(systemName: image)
                Text(name)
                Spacer()
                Image(systemName: "chevron.forward")
            }
        }
    }
}

方法2：通过索引判断（无需Equatable协议） #

如果你的Detail类型不需要实现Equatable，可以遍历数组索引来判断是否为最后一项：

var body: some View {
    NavigationView {
        VStack(alignment: .leading, spacing: 24) {
            ForEach(details.indices, id: \.self) { index in
                NavigationLink {
                    EmptyView()
                } label: {
                    ContentLabelHelpView(name: details[index].name, image: details[index].image)
                }
                // 通过索引判断是否为最后一项
                if index != details.indices.last {
                    Divider()
                }
            }
        }
        .padding()
    }
}

方法3：紧凑写法（Group+条件渲染） #

不想提取子视图的话，用Group包裹重复内容，再通过条件渲染追加Divider：

var body: some View {
    NavigationView {
        VStack(alignment: .leading, spacing: 24) {
            ForEach(details, id: \.name) { detail in
                Group {
                    NavigationLink {
                        EmptyView()
                    } label: {
                        ContentLabelHelpView(name: detail.name, image: detail.image)
                    }
                }
                .overlay(alignment: .bottom) {
                    if detail != details.last {
                        Divider()
                    }
                }
            }
        }
        .padding()
    }
}

额外建议：用List替代（适配列表场景） #

如果你的布局属于标准列表样式，SwiftUI的List会自动在单元格间添加分隔线，且默认不显示顶部/底部分隔线，代码更简洁：

var body: some View {
    NavigationView {
        List(details, id: \.name) { detail in
            NavigationLink {
                EmptyView()
            } label: {
                ContentLabelHelpView(name: detail.name, image: detail.image)
            }
        }
        .listStyle(.plain) // 可根据需求调整列表样式
    }
}

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