SwiftUI TextField按Enter或TAB时内容清空问题求助

问题根源 #

核心问题是数据类型不匹配：

• 当NumberFormatter使用.percent样式时，它会把输入的百分比字符串（比如50%）解析为对应的小数数值（0.5），但你绑定的value是Int类型，无法存储小数，导致解析失败，TextField因此清空内容，无法同步值。
• 而.decimal样式直接处理整数输入，和Int类型匹配，所以能正常工作。

修复步骤 #

1. 修改绑定变量类型
   将@State变量从Int改为Double，因为百分比对应的数值是小数，能完美匹配格式化器的解析结果：

   @State private var value = 0.0
   

2. 优化格式化器配置
   明确开启浮点支持（默认已开启，显式设置更稳妥），保证格式化器能正确处理输入和输出：

   let percentFormatter: NumberFormatter = {
       let formatter = NumberFormatter()
       formatter.minimumFractionDigits = 2
       formatter.maximumFractionDigits = 2
       formatter.numberStyle = .percent
       formatter.allowsFloats = true
       return formatter
   }()
   

3. 调整显示文本逻辑
   因为value现在是小数，直接显示会是0.5这类数值，你可以选择：

   • 乘以100转换为百分比数值显示
   • 用格式化器直接生成标准百分比字符串

修改后的完整代码 #

import SwiftUI

struct ContentView: View {
    @State private var value = 0.0 // 改为Double类型适配百分比解析

    let percentFormatter: NumberFormatter = {
        let formatter = NumberFormatter()
        formatter.minimumFractionDigits = 2
        formatter.maximumFractionDigits = 2
        formatter.numberStyle = .percent
        formatter.allowsFloats = true
        return formatter
    }()

    var body: some View {
        VStack {
            TextField("Enter Value", value: $value, formatter: percentFormatter)
                .textFieldStyle(RoundedBorderTextFieldStyle())
                .padding()

            // 方式1：转换为百分比数值显示
            Text("Entered Value: \(value * 100)%")
            // 方式2：用格式化器生成标准百分比字符串
            // Text("Entered Value: \(percentFormatter.string(from: NSNumber(value: value)) ?? "0%")")
        }
    }
}

额外说明 #

• 当你输入50.00%时，value会被解析为0.5，这是百分比格式化器的默认逻辑（数值 = 百分比值 / 100）。
• 如果需要输入整数直接对应百分比数值（比如输入50，value存储为50并显示为50%），可以给格式化器设置formatter.multiplier = 100，此时数值50会被格式化为50%，输入50%也会解析为50。

内容的提问来源于stack exchange，提问作者k.thomas