SwiftUI中didSet限制字符串数组字符数失效问题排查

场景为投票选项功能，支持动态添加/删除TextField输入投票选项，需求是为每个选项设置最大字符数限制，输入超出时恢复为旧值。目前打印日志显示数据已修正为符合限制的值，但视图中的TextField仍可继续输入超出限制的字符，而单个String的字符限制逻辑可正常运行。

相关代码 #

视图代码 #

VStack {
    ForEach(0..<newPollVM.pollOptions.count, id: \.self) { i in
        HStack {
            TextField("Option \(i + 1)", text: $newPollVM.pollOptions[i])
            .font(.title3)
            .padding(5)
            .overlay(RoundedRectangle(cornerRadius: 5).stroke(Color(UIColor.systemGray), lineWidth: 2))
                    
            Spacer()
                    
            if newPollVM.pollOptions.count > 2 {
                Button {
                    print("DEBUG: Remove row")
                    newPollVM.pollOptions.remove(at: i)
                 } label: {
                    Image(systemName: "delete.left")
                    .foregroundColor(.red)
            }
        }
    }
    .padding(.top, 5)
}
            
if newPollVM.pollOptions.count < 6 {
    Button {
        print("DEBUG: Add Option")
        newPollVM.pollOptions.append("")
        print("DEBUG: \(newPollVM.pollOptions)")
    } label: {
        Text("Add")
        .foregroundColor(.green)
    }
}

ViewModel代码 #

class NewPollViewModel: ObservableObject {
    let characterLimit = 5
    @Published var allowSkipVoting : Bool = false
    @Published var pollOptions : [String] = [""] {
        didSet {
            for (index, pollOption) in pollOptions.enumerated() {
                if pollOption.count > characterLimit && oldValue[index].count <= characterLimit {
                    print("DEBUG: \(oldValue)")
                    self.pollOptions[index] = oldValue[index]
                    print("DEBUG: \(pollOptions)")
                }
            }
        }
    }
    
    func reset() {
        self.allowSkipVoting = false
        self.pollOptions = ["", ""]
    }
}

单个String的有效实现 #

视图代码

TextArea("What's on your mind?", text: $newPostVM.title)
    .font(.title)

ViewModel代码

class NewPostViewModel: ObservableObject {
    let characterLimit = 180
    @Published var title : String = "" {
        didSet {
            if title.count > characterLimit && oldValue.count <= characterLimit {
                title = oldValue
            }
        }
    }
}

问题原因分析 #

1. ForEach标识失效：使用0..<count结合id: \.self作为数据源，SwiftUI无法精准识别单个数组元素的变化，导致视图未及时同步更新。
2. didSet循环触发问题：在pollOptions的didSet中直接修改数组元素，会再次触发didSet调用，同时数组元素绑定的响应存在延迟，导致TextField显示与数据不同步。
3. 绑定粒度差异：单个String的绑定直接指向@Published属性，而数组元素是子绑定，SwiftUI对两种绑定的更新机制不同，子元素更新未正确触发视图重绘。

解决方案 #

方案1：自定义Binding处理字符限制 #

在视图层为每个TextField创建自定义Binding，直接在setter阶段限制字符数，避免依赖ViewModel的didSet：

TextField("Option \(i + 1)", text: Binding(
    get: { newPollVM.pollOptions[i] },
    set: { newValue in
        if newValue.count <= newPollVM.characterLimit {
            newPollVM.pollOptions[i] = newValue
        } else {
            // 超出限制时保持原有值，也可改为截断到限制长度
            newPollVM.pollOptions[i] = String(newValue.prefix(newPollVM.characterLimit))
        }
    }
))

这种方式直接在绑定设置阶段处理限制，避免循环触发问题，确保TextField显示与数据同步。

方案2：将数组元素封装为Observable对象 #

把每个投票选项封装成独立的ObservableObject，让ForEach能准确识别元素变化：

定义选项模型

class PollOption: ObservableObject, Identifiable {
    let id = UUID()
    let characterLimit: Int
    @Published var text: String = "" {
        didSet {
            if text.count > characterLimit && oldValue.count <= characterLimit {
                text = oldValue
            }
        }
    }
    
    init(characterLimit: Int, text: String = "") {
        self.characterLimit = characterLimit
        self.text = text
    }
}

修改ViewModel

class NewPollViewModel: ObservableObject {
    let characterLimit = 5
    @Published var allowSkipVoting : Bool = false
    @Published var pollOptions : [PollOption] = [PollOption(characterLimit: 5)]
    
    func reset() {
        self.allowSkipVoting = false
        self.pollOptions = [PollOption(characterLimit: 5), PollOption(characterLimit: 5)]
    }
}

修改视图代码

VStack {
    ForEach($newPollVM.pollOptions) { $option in
        HStack {
            TextField("Option \(newPollVM.pollOptions.firstIndex(of: option)! + 1)", text: $option.text)
            .font(.title3)
            .padding(5)
            .overlay(RoundedRectangle(cornerRadius: 5).stroke(Color(UIColor.systemGray), lineWidth: 2))
                    
            Spacer()
                    
            if newPollVM.pollOptions.count > 2 {
                Button {
                    print("DEBUG: Remove row")
                    if let index = newPollVM.pollOptions.firstIndex(of: option) {
                        newPollVM.pollOptions.remove(at: index)
                    }
                 } label: {
                    Image(systemName: "delete.left")
                    .foregroundColor(.red)
            }
        }
    }
    .padding(.top, 5)
}
            
if newPollVM.pollOptions.count < 6 {
    Button {
        print("DEBUG: Add Option")
        newPollVM.pollOptions.append(PollOption(characterLimit: newPollVM.characterLimit))
        print("DEBUG: \(newPollVM.pollOptions.map { $0.text })")
    } label: {
        Text("Add")
        .foregroundColor(.green)
    }
}

这种方式让每个选项成为独立可观察对象，ForEach通过Identifiable的id跟踪变化，确保视图精准刷新，同时符合MVVM架构。

方案3：优化ViewModel的didSet逻辑 #

若不想修改视图结构，可调整ViewModel的didSet避免循环触发，同时确保SwiftUI接收到更新通知：

@Published var pollOptions : [String] = [""] {
    didSet {
        var correctedOptions = pollOptions
        var needsUpdate = false
        for (index, pollOption) in pollOptions.enumerated() {
            guard index < oldValue.count else { continue }
            if pollOption.count > characterLimit && oldValue[index].count <= characterLimit {
                correctedOptions[index] = oldValue[index]
                needsUpdate = true
            }
        }
        if needsUpdate {
            DispatchQueue.main.async {
                self.pollOptions = correctedOptions
            }
        }
    }
}

同时修改ForEach的id，确保元素变化时视图刷新：

ForEach(Array(newPollVM.pollOptions.enumerated()), id: \.element) { index, option in
    // TextField绑定保持不变
}

此方案存在一定局限性，可靠性不如前两种。

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