如何在事件渲染时修改FullCalendar上每个事件的css样式？

Question

我正在使用 FullCalendar v5 插件在日历上显示事件。我正在尝试通过添加一些样式来找到一种改变元素的方法。

在版本 4 中，有一个名为 eventRender: function (event, element) {} 的函数可以让我做到这一点。不过5版好像没有那个功能

如何FullCalendar v5在渲染过程中操作事件元素？

Answer 1

如果您查看有关从 v4 迁移到 v5 的文档，您会找到答案。

https://fullcalendar.io/docs/upgrading-from-v4

eventRender: Use the new event render hooks instead

所以使用 v5，最适合你的是 eventDidMount

例如

document.addEventListener('DOMContentLoaded', function () {
    var calendarEventsEl = document.getElementById('calendar-events');

    calendarEvents = new FullCalendar.Calendar(calendarEventsEl, {
        headerToolbar: false,
        contentHeight: 300,
        ...
        eventDidMount: function (arg) {
          // customize an event element here
        }
        ...

如何在事件渲染时修改FullCalendar上每个事件的css样式？

How to modify the css style of each event on FullCalendar during the event rendering?

javascript

fullcalendar

fullcalendar-4

fullcalendar-5