Richtlinie
Wie verwendet man den Datumsauswahler in Capacitor
Mit @capgo/capacitor-date-picker
@capgo/capacitor-date-picker Fügt native Datum, Uhrzeit, Datum-Uhrzeit, Jahr-Monat und Bereichswaehler zu Capacitor-Apps auf iOS und Android hinzu, mit einer passenden Web-Alternative.
Dies ist die von Capgo unterstützte Alternative zu @capacitor-community/date-pickerWir hören uns die Community-Berichte an, beheben Probleme schnell und liefern Updates, anstatt lange offene GitHub-Probleme zu lassen.
Installieren
npm install @capgo/capacitor-date-picker
npx cap sync
Natives Wahlmenü Demo
| iOS | Android |
|---|---|
![]() |
![]() |
Nativere Datumsauswahl-Screenshots
| iOS | Android |
|---|---|
![]() |
![]() |
Ein Datum auswählen
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',
});
Ein Zeitraum auswählen
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);
Ein aktives Picker schließen
await DatePicker.hide();
Was dies behebt
- Capacitor 8 Unterstützung.
- Web-Implementierung mit der gleichen
present()API. - Programmatische
hide(). - Titel der Dialogfenster.
- iOS-rotationssichere Layout, Länderverwaltung und
yearAndMonthModus. - Datenerfassung und Zeitzone-Handling, die sich auf das Datum beschränkt.
- Android eingebaute Optionen,
is24hMinute-Schritte und Auswahl eines Datumsbereichs. - Minute Schritte und Datumseingabebereich.
Vollständige Referenz
- GitHub: https://github.com/Cap-go/capacitor-date-picker/
- Dokumentation: /docs/plugins/date-picker/



