FullCalendar React
FullCalendar React package for rendering a calendar
Installation
npm install @fullcalendar/react temporal-polyfillUsage
Render a FullCalendar component with options, including one or more plugins:
import FullCalendar from '@fullcalendar/react'
import classicThemePlugin from '@fullcalendar/react/themes/classic'
import dayGridPlugin from '@fullcalendar/react/daygrid'
import '@fullcalendar/react/skeleton.css'
import '@fullcalendar/react/themes/classic/theme.css'
import '@fullcalendar/react/themes/classic/palette.css'
<FullCalendar
plugins={[
dayGridPlugin,
classicThemePlugin,
// any other plugins
]}
initialView='dayGridMonth'
weekends={false}
events={[
{ title: 'Meeting', start: new Date() },
]}
/>Plugins
| Import | Provides |
|---|---|
@fullcalendar/react/daygrid |
dayGridDay/Week/Month/Year views |
@fullcalendar/react/timegrid |
timeGridDay/Week views |
@fullcalendar/react/list |
listDay/Week/Month/Year views |
@fullcalendar/react/multimonth |
multiMonthYear view |
@fullcalendar/react/interaction |
dragging, resizing, and date/event selection |
Themes are plugins too. @fullcalendar/react/themes/classic, /monarch, /breezy, /forma, and /pulse are available, each paired with a theme.css and a palette stylesheet.