Zum Hauptinhalt springen
Capgo-Logo
Zurück zu Plugins
@capgo/capacitor-date-picker
Tutorial
von github.com/Cap-go

Datumswahl

Nativ für Datum, Uhrzeit, Datum-Uhrzeit, Jahr-Monat und Bereichswahl für iOS, Android und Web

Downloads/Woche

243

GitHub Sterne

0

Richtlinie

Tutorial zum Datumswähler

Mit @capgo/capacitor-date-picker

@capgo/capacitor-date-picker fütt native Datum, Uhrzeit, Datum-Uhrzeit, Jahr-Monat und Bereichswähler zu Capacitor-Apps auf iOS und Android, mit einer passenden Web-Fallback.

Dies ist Capgo's gehaltene Alternative zu @capacitor-community/date-pickerWir hören uns die Berichte der Gemeinschaft an, beheben Probleme schnell und liefern Updates anstatt lange offene GitHub-Probleme zu lassen.

Installieren

npm install @capgo/capacitor-date-picker
npx cap sync

Demo des nativen Wählers

iOS Android
Animierte iOS-Demo von @capgo/capacitor-Datumsauswahl, die sich öffnet, eine Datei auswählt und sich schließt Animierte Android-Demo von @capgo/capacitor-Datumsauswahl, die sich öffnet, eine Datei auswählt und sich schließt

Bildschirme der nativen Auswahl

iOS Android
iOS-Bildschirm von @capgo/capacitor-Datumsauswahl, die die native Datumsauswahl zeigt Android-Bildschirm von @capgo/capacitor-Datumsauswahl, die die native Datumsauswahl zeigt

Wähle eine Datei

import { DatePicker } from '@capgo/capacitor-date-picker';

const result = await DatePicker.present({
  mode: 'date',
  date: '2026-05-27',
  min: '2026-01-01',
  max: '2026-12-31',
  format: 'yyyy-MM-dd',
  title: 'Select date',
});

console.log(result.value);

Wähle eine Zeit

const result = await DatePicker.present({
  mode: 'time',
  is24h: true,
  minuteStep: 15,
  format: 'HH:mm',
  title: 'Select time',
});

Wähle einen Zeitraum

const range = await DatePicker.presentRange({
  start: '2026-05-01',
  end: '2026-05-27',
  format: 'yyyy-MM-dd',
  startTitle: 'Start date',
  endTitle: 'End date',
});

console.log(range.start, range.end);

Schließe eine aktive Auswahl

await DatePicker.hide();

Was dies behebt

  • Capacitor 8 Unterstützung.
  • Web-Implementierung mit der gleichen present() API.
  • Programmatische hide().
  • Unterstützung für Dialogtitel.
  • iOS-Drehung-sichere Layout, Länderverwaltung und yearAndMonth Modus.
  • Sicherere Datumserkennung und Datum-Zeitzone-Verwaltung.
  • Android-Optionen in NESTED-Format, Dialog-Layout-Verwaltung und UI-Thread-Dialog-Verwaltung. is24hMinute-Schritte und Datum-Rang-Selektion.
  • Vollständige Referenz

__CAPGO_KEEP_0__