Aller directement au contenu

Débuter

GitHub

You can use our AI-Assisted Setup to install the plugin. Add the Capgo skills to your AI tool using the following command:

Copier dans le presse-papier
npx skills add https://github.com/Cap-go/capgo-skills --skill capacitor-plugins

Ensuite, utilisez la prompt suivante :

Use the `capacitor-plugins` skill from `Cap-go/capgo-skills` to install the `@capgo/capacitor-date-picker` plugin in my project.

Si vous préférez la configuration manuelle, installez le plugin en exécutant les commandes suivantes et suivez les instructions spécifiques à la plateforme ci-dessous :

Fenêtre de terminal
npm install @capgo/capacitor-date-picker
npx cap sync
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);
const result = await DatePicker.present({
mode: 'time',
is24h: true,
minuteStep: 15,
format: 'HH:mm',
title: 'Select time',
});
console.log(result.value);

Sélectionnez une date et une heure

Sélectionnez une date et une heure
const result = await DatePicker.present({
mode: 'dateAndTime',
date: '2026-05-27T14:30:00',
format: "yyyy-MM-dd'T'HH:mm:ss",
title: 'Select date and time',
});

Copier dans le presse-papier

Sélectionnez une plage
const result = await DatePicker.present({
mode: 'yearAndMonth',
date: '2026-05-01',
format: 'yyyy-MM',
title: 'Select month',
});

Copier dans le presse-papier

Cacher le sélecteur
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, range.value);
await DatePicker.hide();
await DatePicker.present({
mode: 'date',
date: '2026-05-27',
title: 'Select date',
ios: {
style: 'inline',
theme: 'light',
},
android: {
theme: 'light',
},
});
OptionDescription
modedate, time, dateAndTime, yearAndMonth, countDownTimerou range.
dateValeur sélectionnée par défaut.
min / maxValeurs minimale et maximale sélectionnables.
formatFormat de sortie. Les formats ISO, Java/Unicode et les formats courants de Moment sont pris en charge.
titleTitre de la boîte de dialogue.
localeRégion utilisée par les sélecteurs natifs où pris en charge.
timezoneHeure zone utilisée pour l'analyse et la mise en forme.
is24hPréférez l'heure 24.
minuteStepIntervalle de minute pour le sélecteur d'heure.
doneText / cancelTextÉtiquettes d'action personnalisées.

Le dépôt comprend une Capacitor application d'exemple qui ouvre le sélecteur de date natif, le sélecteur d'heure, le sélecteur de plage, et les appels de version du plugin. hide()iOS

iOSAndroid
Démonstration animée d'iOS @capgo/capacitor-date-picker s'ouvrant, sélectionnant une date et se fermantDémonstration animée d'Android @capgo/capacitor-date-picker s'ouvrant, sélectionnant une date et se fermant

La référence complète de API est maintenue dans le fichier README et les définitions TypeScript :