SwiftUI中ForEach绑定的TextField触发时onChange未调用问题

问题复现 #

直接给ForEach绑定的$item添加onChange修饰符时，不会触发回调，即使列表数据实际已更新（可通过按钮打印验证）。若改用数组索引访问元素，又会因列表增删导致数组越界崩溃。

问题代码示例：

import SwiftUI

struct Item: Identifiable {
    let id = UUID()
    var text: String
}

struct ProblematicView: View {
    @State private var items = [Item(text: "Item 1"), Item(text: "Item 2")]
    
    var body: some View {
        VStack {
            ForEach($items) { $item in
                TextField("输入文本", text: $item.text)
                    .onChange(of: item) { oldValue, newValue in
                        // 此回调不会触发
                        print("元素变更：\(newValue.text)")
                    }
            }
            
            Button("打印列表") {
                print(items.map(\.text))
            }
        }
        .padding()
    }
}

核心原因 #

• 原代码中onChange(of: item)监听的是值类型Item的副本，SwiftUI无法识别副本的属性变化为有效触发信号。
• 使用索引访问元素会破坏SwiftUI的视图标识跟踪机制，元素增删后索引与元素的对应关系失效，引发越界崩溃。

解决方案（无需使用索引） #

方案1：监听元素的具体属性

直接监听元素的单个属性（而非整个元素实例），让SwiftUI准确捕捉到变化：

struct FixedView1: View {
    @State private var items = [Item(text: "Item 1"), Item(text: "Item 2")]
    
    var body: some View {
        VStack {
            ForEach($items) { $item in
                TextField("输入文本", text: $item.text)
                    .onChange(of: item.text) { oldText, newText in
                        print("文本变更：\(newText)")
                    }
            }
            
            Button("打印列表") {
                print(items.map(\.text))
            }
        }
        .padding()
    }
}

方案2：将元素改为ObservableObject

让元素遵循ObservableObject，通过@Published属性自动通知变化，避免值类型的副本问题：

class ItemObject: ObservableObject, Identifiable {
    let id = UUID()
    @Published var text: String
    
    init(text: String) {
        self.text = text
    }
}

struct FixedView2: View {
    @State private var items = [ItemObject(text: "Item 1"), ItemObject(text: "Item 2")]
    
    var body: some View {
        VStack {
            ForEach(items) { item in
                TextField("输入文本", text: $item.text)
                    .onChange(of: item.text) { oldText, newText in
                        print("文本变更：\(newText)")
                    }
            }
            
            Button("打印列表") {
                print(items.map(\.text))
            }
        }
        .padding()
    }
}

方案3：使用自定义绑定

通过自定义绑定的set闭包，在属性更新时直接执行业务逻辑，绕过onChange的检测限制：

struct FixedView3: View {
    @State private var items = [Item(text: "Item 1"), Item(text: "Item 2")]
    
    var body: some View {
        VStack {
            ForEach($items) { $item in
                let customBinding = Binding(
                    get: { item.text },
                    set: { newText in
                        item.text = newText
                        // 直接执行变更后的逻辑
                        print("文本变更（自定义绑定）：\(newText)")
                    }
                )
                
                TextField("输入文本", text: customBinding)
            }
            
            Button("打印列表") {
                print(items.map(\.text))
            }
        }
        .padding()
    }
}

关键说明 #

三种方案均无需使用数组索引，完全依赖Identifiable或ObservableObject的唯一标识（id）让ForEach正确跟踪元素，彻底避免索引越界问题，同时确保变更回调能被正确触发。

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