FullCalendar MUI 整合

显示继承您的事件日历 @mui/物质 主题.

安装

npm install @fullcalendar/react @fullcalendar/mui

使用量

首先,选择"flavor"主题: monarch, (中文(简体) ), forma, (中文(简体) ), breezy, (中文(简体) ), pulse,或 classic。 。 。 .

接下来,决定你是否在使用 FullCalendar "标准" (aka "EventCalendar") 或 溢价 (aka"Scheduler". ) (中文(简体) ).

标准使用

import EventCalendar from '@fullcalendar/mui/monarch/EventCalendar'

import '@fullcalendar/react/skeleton.css'
import '@fullcalendar/mui/monarch/theme.css'

<EventCalendar
  addButton={{
    text: 'Add Event',
    click() {
      alert('add event...')
    }
  }}
/>

使用费

您必须安装额外的软件包 :

npm install @fullcalendar/react-scheduler

然后写您的组件代码 :

import ResourceTimeline from '@fullcalendar/mui/monarch/ResourceTimeline'

import '@fullcalendar/react/skeleton.css'
import '@fullcalendar/mui/monarch/theme.css'

<ResourceTimeline
  addButton={{
    text: 'Add Resource',
    click() {
      alert('add resource...')
    }
  }}
/>

A 类 ResourceTimeGrid 还可以提供基于资源的时间网视图.

自定义使用

要完全控制工具栏、日历视图或插件吗 ? 未来的医生会解释如何做到这一点.