全日历事件类答案

【问题标题】：Fullcalendar event classes全日历事件类
【发布时间】：2021-05-11 18:22:55
【问题描述】：

由于某种原因，fullcalendar 不会将 fc-h-event 类添加到我的“dayGridMonth”视图中的事件中：

最终看起来很糟糕：（第二次活动）

这是我的选择：

this.calendarOptions = {
      plugins: [dayGridPlugin, interactionPlugin, timeGridPlugin, listPlugin],
      locale: gbrLocale,
      initialView: "dayGridMonth",
      headerToolbar: {
        start: "",
        center: "",
        end: ""
      },
      selectable: true,
      events: this.fetchEvents,
      editable: true,
      showNonCurrentDates: false,
      eventResizableFromStart: true,
      dragScroll: true,
      dayMaxEvents: 2,
      navLinks: true,
      dateClick: this.openAddNewEvent,
      eventClick: this.openEditEvent,
      eventDrop: this.eventDrop,
      eventResize: this.eventResize
    };

知道如何在这个视图中添加这个类，或者你能在我的选项中看到错误吗？

【问题讨论】：

fullcalendar.io/docs/eventDisplay

标签： vue.js sass fullcalendar

【解决方案1】：

这应该是正常的行为，其中全天事件突出显示，而时间范围事件用圆点标记。

这是包含 2 种事件类型的 Codesandbox 示例。

https://codesandbox.io/s/zen-darkness-fyfrz?file=/src/components/Calendar.vue

【讨论】：

【解决方案2】：

我正在寻找选项：

eventDisplay: "block"

文档：https://fullcalendar.io/docs/eventDisplay

【讨论】：