Saltare al contenuto

Inizia

GitHub

Puoi utilizzare la nostra configurazione assistita da AI per installare il plugin. Aggiungi le Capgo abilità al tuo strumento AI utilizzando il seguente comando:

Finestra del terminale
npx skills add https://github.com/Cap-go/capgo-skills --skill capacitor-plugins

Poi utilizza il seguente prompt:

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

Se preferisci l'installazione manuale, installa il plugin eseguendo i seguenti comandi e segui le istruzioni specifiche per la piattaforma riportate di seguito:

Finestra del terminale
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);
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',
});
const result = await DatePicker.present({
mode: 'yearAndMonth',
date: '2026-05-01',
format: 'yyyy-MM',
title: 'Select month',
});
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',
},
});
OpzioneDescrizione
modedate, time, dateAndTime, yearAndMonth, countDownTimer, o range.
dateValore selezionato iniziale.
min / maxValori selezionabili minimi e massimi.
formatFormato di output. Sono supportati ISO, Java/Unicode e formati Moment-style comuni.
titleTitolo del dialogo.
localeLocale utilizzato dai picker nativi dove supportato.
timezoneFuso orario utilizzato per la parsing e la formattazione.
is24hPreferisci l'ora 24.
minuteStepIntervallo di minuti del picker dell'ora.
doneText / cancelTextEtichette di azione personalizzate.

Il repository include un'app di esempio Capacitor che apre il picker di data nativo, il picker dell'ora, il picker di intervallo, e le chiamate della versione del plugin. hide()iOS

iOSItaliano
Esempio animato di iOS di @capgo/capacitor-date-picker che si apre, seleziona una data e si chiudeEsempio animato di Android di @capgo/capacitor-date-picker che si apre, seleziona una data e si chiude

Il riferimento completo a @API è mantenuto nel file README e nelle definizioni TypeScript: