道具

支柱类型默认描述
value{ start: Date | null; end: Date | null }Selected date range value
onChange(value: { start: Date | null; end: Date | null }) => voidCallback when value changes
presetsDateRangePreset[]Predefined date range presets
maxDaysnumberMaximum days allowed in range (inclusive)
minDaysnumberMinimum days required in range (inclusive)
allowSingleDateInRangebooleantrue允许开始等于结束的范围
minDateDateMinimum selectable date
maxDateDateMaximum selectable date
localePartial<Locale>Custom locale configuration
initialMonthDateInitial displayed month
size"small" | "medium" | "large" | "x-large""medium"Component size
weekStartsOnWeekDay"sunday"一周的第一天
isDateUnavailable(date: Date) => booleanMark dates as disabled
displayFormatstringCustom display format (e.g. "YYYY/MM/DD")
openbooleanControlled open state
initialOpenbooleanInitial open state (uncontrolled)
onOpenChange(open: boolean) => voidCallback when open state changes
requiredbooleanfalse禁用清除值
showOutsideDaysbooleanfalse显示相邻月份的天数
highlightDatesDate[]Dates to highlight
shouldCloseOnSelectbooleanfalse选择结束日期时自动确认
numberOfMonthsnumber2显示月数
captionLayout"buttons" | "dropdown""buttons"Caption navigation style
fromYearnumberStart year for dropdown
toYearnumberEnd year for dropdown
disablePastbooleanfalse禁用今天之前的日期
disableFuturebooleanfalse禁用今天之后的日期
inlinebooleanfalse内嵌显示日历(无弹出窗口)
namestringHidden input name for form submission (start date)
endNamestringHidden input name for end date (defaults to name-end)
placeholderstringTrigger placeholder text
hideHeaderbooleanfalse隐藏导航标题
hideFooterbooleanfalse隐藏操作页脚

DateRangePreset

interface DateRangePreset {
label: string;
value: { start: Date; end: Date } | (() => { start: Date; end: Date });
}