使用 @capgo/capacitor-date-picker
@capgo/capacitor-date-picker 为 iOS 和 Android 上的 Capacitor 应用添加原生日期、时间、日期时间、年月及范围选择器，并提供配套的 Web 回退方案。
这是 Capgo 维护的替代方案，旨在取代 @capacitor-community/date-picker。我们积极响应社区反馈，快速修复问题并发布更新，而不是让 GitHub 的遗留问题长期悬而未决。
安装
npm install @capgo/capacitor-date-picker
npx cap sync
原生选择器 Demo
| iOS | Android |
|---|---|
 |
 |
原生选择器截图
| 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 旋转安全布局、locale 处理以及
yearAndMonth模式。 - 更安全的日期解析和仅日期时区处理。
- Android 嵌套选项，
is24h，对话框布局处理以及 UI 线程对话框处理。 - 分钟步长和日期范围选择。
完整参考
- GitHub: https://github.com/Cap-go/capacitor-date-picker/
- 文档：/docs/plugins/date-picker/