如何将 SwiftUI 框架中 DatePicker 的外观更改为仅月份和年份？

我想更改 DatePicker 日期视图。我只想选择月份和年份。我想在每次选择时将观察到的对象分配给一个变量。

My Code:

 @State private var date = Date()

 var body: some View {
          DatePicker("", selection: $date, in: Date()..., displayedComponents: .date)
                    .labelsHidden()
                    .datePickerStyle(WheelDatePickerStyle())
                    .onDisappear(){
                        let dateFormatter = DateFormatter()
                        dateFormatter.dateFormat = "MM/yyyy"
                        self.cardData.validThru = dateFormatter.string(from: self.date)
                    }
 }

正如其他人已经评论的那样，您需要使用两个 Picker 来实现 HStack：

struct ContentView: View {

    @State var monthIndex: Int = 0
    @State var yearIndex: Int = 0

    let monthSymbols = Calendar.current.monthSymbols
    let years = Array(Date().year..<Date().year+10)

    var body: some View {
        GeometryReader{ geometry in
            HStack(spacing: 0) {
                Picker(selection: self.$monthIndex.onChange(self.monthChanged), label: Text("")) {
                    ForEach(0..<self.monthSymbols.count) { index in
                        Text(self.monthSymbols[index])
                    }
                }.frame(maxWidth: geometry.size.width / 2).clipped()
                Picker(selection: self.$yearIndex.onChange(self.yearChanged), label: Text("")) {
                    ForEach(0..<self.years.count) { index in
                        Text(String(self.years[index]))
                    }
                }.frame(maxWidth: geometry.size.width / 2).clipped()
            }
        }  
    }
    func monthChanged(_ index: Int) {
        print("\(years[yearIndex]), \(index+1)")
        print("Month: \(monthSymbols[index])")
    }
    func yearChanged(_ index: Int) {
        print("\(years[index]), \(monthIndex+1)")
        print("Month: \(monthSymbols[monthIndex])")
    }
}

你需要这个助手post监控 Picker 的变化

extension Binding {
    func onChange(_ completion: @escaping (Value) -> Void) -> Binding<Value> {
        .init(get:{ self.wrappedValue }, set:{ self.wrappedValue = $0; completion($0) })
    }
}

还有这个日历助手

extension Date {
    var year: Int { Calendar.current.component(.year, from: self) }
}