Calendar

Display date.

Basic

Custom Content

Range

Customize header

Localization

The default locale of is English, if you need to use other languages, please check Internationalization

Note, date time locale (month name, first day of the week ...) are also configured in localization.

Attributes

NameDescriptionTypeDefault
model-value / v-modelbinding valueDate
rangetime range, including start time and end time. Start time must be start day of week, end time must be end day of week, the time span cannot exceed two months.[Date, Date]

Slots

NameDescriptionType
date-celltype indicates which month the date belongs, optional values are prev-month, current-month, next-month; isSelected indicates whether the date is selected; day is the formatted date in the format YYYY-MM-DD; date is date the cell represents{ type: 'prev-month' | 'current-month' | 'next-month', isSelected: boolean, day: string, date: Date }
headercontent of the Calendar header

Source

ComponentDocs

Contributors