如何不使用Section实现带成员分隔效果的SwiftUI列表？

方案一：iOS 15+ 原生API实现 #

利用SwiftUI 3.0新增的.listRowSeparator修饰符，直接控制列表项分隔线的显示与样式，无需嵌套Section：

List {
    ForEach(items, id: \.self) { item in
        NavigationLink {
            VStack {
                Text(item.name ?? "Err").font(.title)
                Text(item.category ?? "Err").font(.subheadline)
            }
        } label: {
            HStack {
                Text("\(item.order)")
                Spacer()
                Text(item.name ?? "Err")
            }
        }
        // 强制显示分隔线
        .listRowSeparator(.visible)
        // 调整分隔线内边距，匹配目标样式的视觉效果
        .listRowSeparatorInsets(EdgeInsets(top: 0, leading: 16, bottom: 0, trailing: 16))
    }
}
// 使用.inset样式替代insetGrouped，避免Section带来的分组效果
.listStyle(.inset)

方案二：兼容低版本iOS（iOS 13+） #

通过自定义分隔视图Divider，手动为每个列表项添加分隔线，最后一项不显示：

List {
    ForEach(items.indices, id: \.self) { index in
        let item = items[index]
        NavigationLink {
            VStack {
                Text(item.name ?? "Err").font(.title)
                Text(item.category ?? "Err").font(.subheadline)
            }
        } label: {
            VStack(spacing: 0) {
                HStack {
                    Text("\(item.order)")
                    Spacer()
                    Text(item.name ?? "Err")
                }
                // 最后一个列表项不显示分隔线
                if index != items.count - 1 {
                    Divider()
                        .padding(.leading, 16)
                }
            }
        }
    }
}
// 使用plain样式消除默认列表的额外样式干扰
.listStyle(.plain)

说明 #

• 方案一利用原生API，代码简洁且样式更贴近系统原生效果，适合iOS 15及以上版本。
• 方案二通过自定义分隔线实现兼容，可覆盖更早的iOS版本，视觉效果可通过调整Divider的内边距灵活控制。

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