mirror of
https://github.com/ant-design/ant-design.git
synced 2025-01-24 02:20:01 +08:00
829b5f87bf
* feat: make default locale to enUS * test: fix CI * docs: update getting started
2.3 KiB
2.3 KiB
category | type | cols | title |
---|---|---|---|
Components | Data Display | 1 | Calendar |
Container for displaying data in calendar form.
When To Use
When data is in the form of dates, such as schedules, timetables, prices calendar, lunar calendar. This component also supports Year/Month switch.
API
Note: Part of the Calendar's locale is read from value
. So, please set the locale of moment
correctly.
// The default locale is en-US, if you want to use other locale, just set locale in entry file globaly.
// import moment from 'moment';
// import 'moment/locale/zh-cn';
// moment.locale('zh-cn');
<Calendar
dateCellRender={dateCellRender}
monthCellRender={monthCellRender}
onPanelChange={onPanelChange}
onSelect={onSelect}
/>
Property | Description | Type | Default |
---|---|---|---|
value | The current selected date | moment | current date |
defaultValue | The date selected by default | moment | default date |
mode | The display mode of the calendar | month | year |
month |
fullscreen | Whether to display in full-screen | boolean | true |
dateCellRender | Customize the display of the date cell, the returned content will be appended to the cell | function(date: moment): ReactNode | - |
monthCellRender | Customize the display of the month cell, the returned content will be appended to the cell | function(date: moment): ReactNode | - |
dateFullCellRender | Customize the display of the date cell, the returned content will override the cell | function(date: moment): ReactNode | - |
monthFullCellRender | Customize the display of the month cell, the returned content will override the cell | function(date: moment): ReactNode | - |
locale | The calendar's locale | object | default |
onPanelChange | Callback for when panel changes | function(date: moment, mode: string) | - |
onSelect | Callback for when a date is selected | function(date: moment) | - |
disabledDate | Function that specifies the dates that cannot be selected | (currentDate: moment) => boolean | - |