SwiftUI中TextField的shouldChangeText属性使用及输入过滤问题

首先明确：SwiftUI原生的TextField并没有shouldChangeText这个属性，你提到的方法是UIKit框架中UITextField的代理方法。要实现输入时直接阻止非数字内容显示在界面上，需要通过UIViewRepresentable把UIKit的UITextField封装成SwiftUI可用的组件，再利用代理方法拦截输入。

步骤1：封装支持数字过滤的自定义TextField #

创建遵循UIViewRepresentable的结构体，内部实现UITextFieldDelegate处理输入拦截逻辑：

import SwiftUI

struct NumericTextField: UIViewRepresentable {
    let placeholder: String
    @Binding var text: String
    
    // 创建并配置UITextField实例
    func makeUIView(context: Context) -> UITextField {
        let textField = UITextField()
        textField.placeholder = placeholder
        textField.keyboardType = .numberPad // 可选：直接弹出数字键盘，减少非数字输入可能
        textField.delegate = context.coordinator
        return textField
    }
    
    // 同步SwiftUI状态到UIKit组件
    func updateUIView(_ uiView: UITextField, context: Context) {
        if uiView.text != text {
            uiView.text = text
        }
    }
    
    // 创建协调器处理代理逻辑
    func makeCoordinator() -> Coordinator {
        Coordinator(text: $text)
    }
    
    class Coordinator: NSObject, UITextFieldDelegate {
        @Binding var text: String
        
        init(text: Binding<String>) {
            _text = text
        }
        
        // 核心拦截逻辑：只允许数字输入
        func textField(_ textField: UITextField, shouldChangeCharactersIn range: NSRange, replacementString string: String) -> Bool {
            // 允许删除操作（空字符串对应删除键输入）
            if string.isEmpty {
                return true
            }
            
            // 校验输入字符是否全为数字
            let allowedCharacters = CharacterSet.decimalDigits
            let inputCharacterSet = CharacterSet(charactersIn: string)
            return allowedCharacters.isSuperset(of: inputCharacterSet)
        }
    }
}

步骤2：在SwiftUI View中使用自定义TextField #

现在可以像使用原生TextField一样调用NumericTextField，输入非数字内容时会直接被拦截，不会显示在界面上：

struct ContentView: View {
    @State private var scannedBarcode = ""
    
    var body: some View {
        VStack(spacing: 20) {
            NumericTextField(placeholder: "enter barcode", text: $scannedBarcode)
                .padding()
                .border(.gray)
            
            Text("输入的条码：\(scannedBarcode)")
        }
        .padding()
    }
}

逻辑说明 #

• shouldChangeCharactersIn方法返回true表示允许输入，返回false则阻止内容显示。
• 先判断删除操作（空字符串）直接放行，再校验输入内容是否全为数字，只有符合条件才允许显示。
• 配置keyboardType = .numberPad是可选优化，从输入源减少非数字输入，但即使用户通过粘贴等方式输入非数字，代理方法依然会拦截。

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