大量TextField导致SwiftUI界面滚动卡顿及输入异常问题排查

核心问题根源 #

• 自定义Binding的不稳定：如果你的自定义Binding在get/set方法中做了多余的计算、状态变更，或者没有正确关联数据源，会让LazyVGrid的单元格频繁重绘。LazyVGrid本来靠复用单元格提升性能，Binding的波动会打破这个机制，直接拖慢滚动速度。
• 高索引TextField的键盘异常：这是单元格复用导致的焦点丢失。滚动到高索引区域时，LazyVGrid会回收之前的单元格重新绑定数据，此时TextField的焦点被强制重置，键盘自然弹出来又缩回去。
• Text切换TextField失败：大概率是没给每个单元格绑定独立的焦点状态，复用单元格时状态串了，切换时焦点没正确落在对应的TextField上。

具体修复方案 #

1. 换掉自定义Binding，用原生数组Binding
   直接用$数据源数组[index]或者结合Identifiable的$item，原生Binding的性能和稳定性远优于自定义的，能避免不必要的重绘。

   // 示例：用Identifiable数据结构+原生Binding
   struct FormItem: Identifiable {
       let id = UUID()
       var key: String
       var value: String
   }
   
   @State private var formItems: [FormItem] = Array(repeating: FormItem(key: "", value: ""), count: 100)
   
   LazyVGrid(columns: [GridItem(.flexible()), GridItem(.flexible())]) {
       ForEach($formItems) { $item in
           TextField("键", text: $item.key)
           TextField("值", text: $item.value)
       }
   }
   

2. 给数据项加唯一ID，别用数组索引当标识
   用索引当id的话，数组元素变动或滚动时，LazyVGrid会错误复用单元格，引发焦点、数据显示的问题。给每个数据项加UUID作为唯一标识，让单元格复用逻辑准确。
3. 正确实现Text与TextField的切换
   给每个单元格绑定独立的焦点状态，关联数据项的唯一ID，避免复用导致状态混乱：

   @State private var focusedId: UUID?
   
   LazyVGrid(columns: [GridItem(.flexible()), GridItem(.flexible())]) {
       ForEach($formItems) { $item in
           // 键字段的切换逻辑
           if focusedId == item.id {
               TextField("键", text: $item.key)
                   .focused($focusedId, equals: item.id)
           } else {
               Text(item.key.isEmpty ? "点击输入键" : item.key)
                   .onTapGesture {
                       focusedId = item.id
                   }
           }
           // 值字段同理
           if focusedId == item.id {
               TextField("值", text: $item.value)
                   .focused($focusedId, equals: item.id)
           } else {
               Text(item.value.isEmpty ? "点击输入值" : item.value)
                   .onTapGesture {
                       focusedId = item.id
                   }
           }
       }
   }
   

4. 减少视图不必要更新
   • 用@StateObject管理数据源（如果是引用类型），避免值类型频繁复制触发整个视图重绘。
   • 给TextField用轻量的样式，比如.textFieldStyle(.plain)，减少系统渲染的开销。

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