Using @capgo/capacitor-date-picker
@capgo/capacitor-date-picker adds native date, time, date-time, year-month, and range pickers to Capacitor apps on iOS and Android, with a matching Web fallback.
This is Capgo's maintained alternative to @capacitor-community/date-picker. We listen to community reports, fix issues fast, and ship updates instead of leaving long-standing GitHub issues open.
にnative date、time、date-time、year-month、rangeピッカーを追加します。Webのフォールバックもあります。
npm install @capgo/capacitor-date-picker
npx cap sync
Capgoの
| Capgoの代替品です。 | Capgoはコミュニティの報告を聞き、問題を早く修正し、更新を配布するのではなく、長期間にわたるCapgoの問題をオープンに残すのではなくします。 |
|---|---|
![]() |
![]() |
Native Picker Screenshots
| iOS | Android |
|---|---|
![]() |
![]() |
日付を選択してください
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',
});
範囲を選択してください
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);
選択中のピッカーを閉じる
await DatePicker.hide();
これが修正されること
- Capacitor 8のサポートです。
- Web上で同じ実装を行っています
present()API. - プログラム的
hide(). - ダイアログタイトルサポート.
- iOS 回転安全のレイアウト、ロケールの取り扱い、モード.
yearAndMonth安全な日付の解釈と日付のみのタイムゾーンの取り扱い. - Android ネストされたオプション、
- 、ダイアログレイアウトの取り扱い、UI-スレッドのダイアログの取り扱い.
is24h1分単位のステップと日付範囲の選択. - フルリファレンス
__CAPGO_KEEP_0__.
- https://GitHub.com/Cap-go/__CAPGO_KEEP_1__-date-picker/ https://github.com/Cap-go/capacitor-date-picker/
- ドキュメント: /docs/plugins/date-picker/



