SwiftUI DatePicker切换12小时时段时不更新状态问题排查

问题背景 #

使用SwiftUI的DatePicker（滚轮样式）绑定@State变量展示时间时，多数场景下状态更新正常，但切换12小时制的AM/PM时段（如从下午3点切到凌晨3点）时，绑定的变量不会更新，onChange修饰器也不会触发回调。

问题原因 #

这是SwiftUIDatePicker在仅展示小时和分钟组件时的已知问题：切换AM/PM时段时，组件内部的绑定更新逻辑未正确触发@State变量的变更通知，导致视图和回调都无法响应变化。此外，原代码中重复设置datePickerStyle属于冗余代码，虽不影响功能，但应清理。

修复方案 #

使用自定义绑定替代直接绑定@State变量，手动处理值的更新逻辑，确保任何时间变化（包括AM/PM切换）都能触发状态更新。

修改后的代码示例 #

import SwiftUI

struct TimePicker: View {
    @State private var time = Date()
    
    // 自定义绑定，强制触发状态更新
    private var timeBinding: Binding<Date> {
        Binding(
            get: { time },
            set: { newValue in
                time = newValue
                // 原onChange的逻辑直接放在这里
                print("选中时间：\(newValue.formatted(date: .omitted, time: .standard))")
            }
        )
    }
    
    var body: some View {
        VStack(alignment: .center, spacing: 0) {
            Spacer()
            VStack {
                Spacer()
                HStack {
                    Spacer()
                    DatePicker("", 
                               selection: timeBinding,
                               displayedComponents: .hourAndMinute)
                    .datePickerStyle(.wheel)
                    .fixedSize()
                    .accentColor(.red)
                }
                // 展示选中的时间，验证更新效果
                Text(time.formatted(date: .omitted, time: .standard))
                    .padding()
                Spacer()
            }
            .background(Color.gray.opacity(0.1)) // 替换为你的.appBackground
        }
    }
}

代码说明 #

1. 自定义绑定：通过Binding手动实现get和set方法，set方法中直接更新@State变量，确保任何值变化都会触发状态更新。
2. 移除冗余代码：删除了重复的.datePickerStyle(WheelDatePickerStyle())调用，只保留.datePickerStyle(.wheel)即可。
3. 添加测试文本：新增Text组件展示选中时间，方便直观验证修复效果。

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