SwiftUI List中TextField输入内容自动重复到其他输入框问题

异常现象 #

在第一个TextField输入内容时，内容会自动同步到其余所有TextField，效果如下：

问题根因 #

• 核心触发原因：Person模型遵循Identifiable协议，但每次新增空实例时id字段都赋值为空字符串，所有列表元素id完全一致。ForEach通过id区分不同行视图，id重复时SwiftUI会判定多行为同一视图，无法正确维护每个子视图的独立状态，最终出现输入错乱同步。
• 逻辑设计缺陷：子视图PersonView使用本地@State存储输入值，既没有和ViewModel中的数据源做双向绑定，初始化传入的name、age参数也没有做状态映射，列表刷新时会出现状态复用错误，且输入内容无法持久化到数据源。

修复方案 #

1. 修正Model与ViewModel层实现 #

给每个Person实例分配唯一id，调整方法语义匹配实际逻辑：

struct Person: Identifiable {
    // 自动生成唯一id，保证每条数据id不重复
    var id = UUID().uuidString
    var name: String
    var age: String
}

class PersonViewModel: ObservableObject {
    // 遵循Swift小驼峰命名规范调整属性名
    @Published var personArray = [Person]()
    
    // 原方法名emptyPersonArray语义错误，调整为新增空人员数据
    func addEmptyPerson() {
        personArray.append(Person(name: "", age: ""))
    }
}

2. 调整主视图ContentView逻辑 #

• 视图内初始化的ViewModel改用@StateObject（iOS14+），避免视图刷新时ViewModel被重复创建导致数据丢失
• 遍历列表时直接传递绑定的person实例给子视图，不要仅传递初始值：

struct ContentView: View {
    @StateObject var personViewModel = PersonViewModel()
   
    var body: some View {
        VStack{
            Button(action: {
                personViewModel.addEmptyPerson()
            }) {
                HStack {
                    Text("Add")
                        .font(.title3)
                        .bold()
                }
            }
            .padding()
            .foregroundColor(Color.black)
            .frame(width: 150.72, height: 40)
            .background(RoundedRectangle(cornerRadius: 6).stroke(Color(red: 0.463, green: 0.483, blue: 1.034), lineWidth: 2))
            
            List{
                // 遍历绑定的数组元素，直接传递绑定值给子视图
                ForEach($personViewModel.personArray) { $person in
                    PersonView(person: $person)
                }
            }
        }
    }
}

3. 重写子视图PersonView #

移除本地独立的@State变量，直接绑定父视图传入的person数据，输入内容自动同步到ViewModel数据源：

struct PersonView: View {
    // 接收父视图传入的双向绑定数据
    @Binding var person: Person
    
    var body: some View {
        ZStack {
            RoundedRectangle(cornerRadius: 9)
                .fill(Color.white)
                .frame(width: 650, height: 180)
            
            VStack (alignment: .center) {
                Text("Person")
                    .font(.title3)
                    .fontWeight(.bold)
                
                VStack{
                    Text("Enter Name:")
                    TextField("", text: $person.name)
                        .frame(width: 289, height: 40.0)
                        .background(RoundedRectangle(cornerRadius: 6).stroke(Color.black))
                    
                    Text("Enter Age:")
                    TextField("", text: $person.age)
                        .padding()
                        .frame(width: 289, height: 40.0)
                        .background(RoundedRectangle(cornerRadius: 6).stroke(Color.black))
                }
                .padding(.leading)
            }
        }
    }
}

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