SwiftUI如何在ForEach中遍历嵌套数组并正确展示元素

• 变量名引用错误：定义的数组变量名为Users，循环取值时错误引用了不存在的Data变量，直接导致编译失败
• 数据类型设计不合理：使用[String: Any]类型的无类型字典混存字符串、整数、SwiftUIImage等不同类型的值，取值时需要手动强转，配合强制解包!一旦类型/key不匹配就会触发运行时崩溃
• 冗余的视图转换：字典中存储的本身就是SwiftUI原生Image视图，不需要先转UIImage再重新初始化Image
• 遍历方式存在隐患：直接使用数组索引作为ForEach的唯一标识，后续如果数组动态增删、重排元素，很容易出现UI渲染错位、应用崩溃的问题
• 命名不规范：Swift语法约定类型/协议名使用大驼峰，变量/实例名使用小驼峰，Users作为数组变量使用大写开头不符合规范

优先推荐定义强类型的用户模型，遵守Identifiable协议后可以直接给ForEach遍历，从根源避免类型转换、索引错位的问题，可直接运行的代码如下：

// 定义强类型用户模型，遵守Identifiable协议供ForEach识别
struct User: Identifiable {
    let id = UUID()
    let name: String
    let age: Int
    let profilePicture: Image
    let status: String
    let icon: Image
}

struct MyUserView: View {
    // 初始化强类型用户数组
    private let users: [User] = [
        User(
            name: "Manuelle",
            age: 23,
            profilePicture: Image(systemName: "person"),
            status: "inactive",
            icon: Image(systemName: "message.fill")
        ),
        User(
            name: "Michael",
            age: 39,
            profilePicture: Image(systemName: "person"),
            status: "active 12 minutes ago",
            icon: Image(systemName: "square.on.square")
        )
    ]
    
    var body: some View {
        NavigationView {
            List {
                // 直接遍历模型数组，无需手动指定id
                ForEach(users) { user in
                    HStack(spacing: 12) {
                        user.profilePicture
                        VStack(alignment: .leading, spacing: 4) {
                            Text(user.name)
                                .font(.body)
                            Text(user.status)
                                .font(.caption)
                                .foregroundColor(.secondary)
                        }
                        Spacer()
                        user.icon
                            .foregroundColor(.blue)
                    }
                    .padding(.vertical, 8)
                }
            }
            .navigationTitle("用户列表")
        }
    }
}

不推荐的临时兼容方案：如果你一定要保留原有字典结构实现遍历，至少要修正变量名、去掉冗余转换，代码如下，这种写法只要字典key或者值类型不匹配就会崩溃，不要在生产环境使用：

struct MyUserView: View {
    private let users: [[String: Any]] = [
        ["name": "Manuelle", "age": 23, "profilePicture": Image(systemName: "person"), "status": "inactive", "icon": Image(systemName: "message.fill")],
        ["name": "Michael", "age": 39, "profilePicture": Image(systemName: "person"), "status": "active 12 minutes ago", "icon": Image(systemName: "square.on.square")]
    ]

    var body: some View {
        NavigationView {
            List {
                ForEach(Array(users.enumerated()), id: \.offset) { _, user in
                    HStack {
                        Text(user["name"] as! String)
                        user["profilePicture"] as! Image
                    }
                }
            }
        }
    }
}

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