日期日历
页面内月份日历，支持单日或区间。
页面内月份日历，支持单日或区间。
November 2026
| Su | Mo | Tu | We | Th | Fr | Sa |
|---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 |
安装
npx @joyui/cli add date-calendar --yes或通过 JoyUI MCP / CLI 安装。
应用场景
将上方预览中的 props 换成业务文案与状态即可用于表单、工具栏或设置页。
上方预览中的文案、选项与数据均可替换为业务配置；不要复制写死的演示常量到生产。
API
DateCalendar
| 参数 | 说明 | 类型 | 可选值 | 默认值 |
|---|---|---|---|---|
| …props | 请以组件源码导出的 Props 类型为准；常用 className、受控 value、children 均可配置。 | 见源码 | — | — |
| className | 合并到根节点的额外类名。 | string | — | — |