SwiftUI：解决List多元素报错，创建不受HStack限制的可滚动列表

错误原因 #

SwiftUI 的 ViewBuilder 对静态嵌入的子视图数量有默认10个的限制，直接在 List 里写超过10个 CardView 就会触发"Extra argument in call"错误。

解决方案 #

推荐用数据驱动+ForEach循环的方式构建列表，既解决数量限制问题，也方便后续自定义不同样式的卡片。

1. 基础解决（快速适配现有代码）

如果只是需要生成多个相同的 CardView，直接用 ForEach 循环生成即可：

List {
    // 生成15个CardView，数量可随意调整
    ForEach(0..<15) { _ in
        CardView()
            .padding() // 后续添加间距直接在这里设置
    }
}

2. 支持自定义样式的进阶方案

如果后续要给不同卡片设置不同样式（比如不同图标、文本），建议定义数据模型并让 CardView 接收数据：

步骤1：定义数据模型

// 遵循Identifiable，方便ForEach遍历
struct CardData: Identifiable {
    let id = UUID()
    let iconName: String
    let mainText: String
    let rightText: String
}

步骤2：修改CardView接收数据参数

struct CardView: View {
    let data: CardData
    
    var body: some View {
        HStack{
            Image(systemName: data.iconName)
            Divider()
            Text(data.mainText)
                .frame(minWidth: 100)
            Divider()
            Spacer()
            Text(data.rightText)
        }
    }
}

步骤3：用数据数组构建List

// 准备卡片数据，可添加任意数量
let cardList: [CardData] = [
    CardData(iconName: "circle.hexagongrid", mainText: "文本1", rightText: "1111"),
    CardData(iconName: "square.stack", mainText: "文本2", rightText: "2222"),
    CardData(iconName: "star.fill", mainText: "文本3", rightText: "3333"),
    // ... 继续添加更多卡片数据
]

// 构建列表
List {
    ForEach(cardList) { card in
        CardView(data: card)
            .padding() // 设置卡片间距
    }
}

补充说明 #

这种数据驱动的方式不仅突破了视图数量限制，还能轻松实现卡片样式的差异化——只要在 CardData 里添加更多属性（比如文本颜色、背景色），再在 CardView 中根据这些属性调整样式即可。

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