API 参考
<Calendar> 组件的全部属性、回调与导出类型。
数据属性
| 属性 | 类型 | 默认值 | 说明 |
|---|
events bindable | CalendarEvent[] | [] | 事件列表;编辑结果会写回。 |
date bindable | Date | new Date() | 聚焦日期。 |
view bindable | CalendarView | 'month' | 当前视图。 |
sources | CalendarSource[] | [] | 日历分组:颜色、可见性、可编辑性。 |
resources | Resource[] | [] | 资源视图的列;事件通过 resourceId 关联。 |
timeZone | string | 本地 | IANA 显示时区;编辑结果自动换算回真实时刻。 |
validRange | { start?, end? } | — | 范围外的日期只读且不可导航。 |
eventOverlap | boolean | true | false 时拒绝时间冲突的拖放/新建(定时事件)。 |
显示属性
| 属性 | 类型 | 默认值 | 说明 |
|---|
locale | string | 'en' | BCP-47 标签;决定所有格式与内置文案。 |
messages | Partial<CalendarMessages> | — | 覆盖界面文案。 |
firstDayOfWeek | 0–6 | 由 locale 推断 | 0 = 周日。 |
weekends | boolean | true | 显示周六/周日列。 |
weekNumbers | boolean | false | ISO 周数。 |
fixedWeeks | boolean | false | 月视图恒定 6 行。 |
dayMaxEvents | number | 4 | 月视图每格行数(含“还有 N 项”)。 |
views | CalendarView[] | 全部五种 | 工具栏视图按钮。 |
header | boolean | true | 渲染内置工具栏。 |
theme | 'light' | 'dark' | 'auto' | 'light' | 配色方案。 |
agendaDays | number | 30 | 议程视图天数。 |
hour12 | boolean | 由 locale 推断 | 时制。 |
class | string | — | 附加到根节点的类名。 |
时间网格属性
| 属性 | 类型 | 默认值 |
|---|
dayStartHour / dayEndHour | number | 0 / 24 |
slotDuration / snapDuration | number (分钟) | 30 / 15 |
hourHeight | number (px) | 48 |
scrollToHour | number | 7 |
businessHours | boolean | BusinessHours | null |
nowIndicator | boolean | true |
交互属性与回调
| 属性 | 类型 | 说明 |
|---|
editable | boolean | 启用拖动与调整。 |
selectable | boolean | 启用拖选。 |
eventDetails | boolean = true | 点击日程时的内置详情弹层(设置 onEventClick 时让位)。 |
quickCreate | boolean = true | 点击/框选空白时的内置快速新建弹层(需 selectable 或 editable;设置 onSelect/onDateClick 时让位)。 |
onEventClick | (instance, e) => void | 事件被点击。 |
onDateClick | (date, allDay) => void | 空白格被点击。 |
onSelect | (sel: RangeSelection) => void | 拖选完成。 |
onEventChange | (info: EventChangeInfo) => void | 拖拽落地;info.revert() 可回滚。 |
onEventCreate | (event) => void | 快速新建向绑定数组添加了日程。 |
onEventDelete | (event, occurrence?) => void | 日程被删除;仅删系列中某一次时携带 occurrence。 |
onSeriesDetach | ({ series, detached, occurrence }) => void | “仅此日程”:某次被拆分为独立日程。 |
onSeriesSplit | ({ truncated, created, occurrence }) => void | “此次及以后”:系列在该次处被拆分。 |
onRangeChange | (start, end) => void | 可见范围变化(含首次挂载)——适合按需拉取数据。 |
onViewChange | (view) => void | 视图切换。 |
onDateChange | (date) => void | 聚焦日期变化。 |
eventContent | Snippet<[EventInstance]> | 自定义事件内容。 |
toolbarEnd | Snippet | 工具栏附加内容。 |
导出类型
CalendarEvent · CalendarSource · CalendarView · EventInstance · EventChangeInfo · RangeSelection · RecurrenceRule · BusinessHours · CalendarMessages · PaletteColor · Weekday
导出工具函数
| 导出 | 说明 |
|---|
MiniCalendar | 独立迷你月历组件。 |
parseRRule / expandRecurrence | 重复规则解析与展开。 |
detachOccurrence / excludeOccurrence / splitSeries | 系列编辑纯函数(“仅此日程”/“此次及以后”)。 |
parseICS / toICS | iCalendar(.ics)导入与导出。 |
serializeRRule | RecurrenceRule → RRULE 字符串。 |
toZoned / fromZoned | 显示时区换算辅助函数。 |
expandEvents | 事件 → 区间内的具体实例。 |
layoutDay / layoutWeekRow | 纯函数布局算法。 |
en / zhCN / messagesForLocale / localeFirstDay | 国际化辅助。 |
addDays, startOfWeek, monthGrid, … | 零依赖日期工具。 |