为什么V5的eventClassNames中返回的类没有应用

Question

使用Alpinejs 2应用程序中的fullcalendar v.7.2，我想根据不同的情况为单元格设置不同的颜色关于一些性质和阅读https://fullcalendar.io/docs/classname-inputI catch事件：

dayMaxEvents: true,
views: {
dayGridMonth: {
editable: false
}
},
events: function (info, successCallback, failureCallback) {    //get data from db for selected dates
self.select_year = parseInt(moment(info.start).format('YYYY'))
self.select_month = parseInt(moment(info.start).format('MM'))
var dataArray = {
'_token': '{{ $csrf_token }}',
'start': moment(info.start).format('YYYY-MM-DD'),
'end': moment(info.end).format('YYYY-MM-DD'),
'ad_categories': self.searchSelectedCategoryIds,
'users': self.searchSelectedUserIds,
'status': self.searchStatus,
'text': self.searchText
}
window.axios.post('/admin/get_ad_events', dataArray).then((response) => {
successCallback(response.data.events);
}).catch((error) => {
console.error(error)
failureCallback(error)
popupAlert('Calendar', 'Run time error : ' + getErrorMessage(error), 'error')
});
}, // events: function(info, successCallback, failureCallback) {    //get data from db for selected dates
eventClassNames: function(arg) {
// return 'fullcalendar_nearest_days'; // if to uncomment this line it does not work anyway
if (arg.event.extendedProps.is_past) {
return [ 'fullcalendar_nearest_days' ]
} else {
return [ 'normal' ]
}

我检查并查看fullcalendar_earest_days是否已返回，但它的属性未应用以及检查事件代码，我在事件样式中看不到"fullcalendar_earest_days"。。。

哪种方式是正确的？

修改：fullcalendar_earest_days定义为：

.fullcalendar_nearest_days {
background-color: red !important;
color: yellow !important;
font-weight: bold;
}

并且查看生成的代码，我发现fullcalendar_；a"；标签类定义：

<div class="fc-daygrid-event-harness fc-daygrid-event-harness-abs"
style="visibility: hidden; top: 0px; left: 0px; right: 0px;"><a
class="fc-daygrid-event fc-daygrid-dot-event fc-event fc-event-draggable fc-event-resizable fc-event-start fc-event-end fc-event-past fullcalendar_nearest_days"
data-id="undefined"><span class="flex flex-nowrap"><

fullcalendar_earest_days的属性是否未被应用，因为它们被fc daygrid事件fc daygriddot事件fc事件fc事件可拖动fc事件可调整大小fc事件开始fc事件结束fc事件过去覆盖？我可以删除"中的所有/部分类吗；a"；标记某些日期的类定义？

谢谢！

Answer 1

我用你的CSS做了一个演示-https://codepen.io/ADyson82/pen/zYwYxRp。定时事件似乎没有问题，类被应用于正确的事件，颜色会如你所期望的那样变化。

然而，在全天活动中，黄色不适用。如果您在浏览器中使用元素检查器，您可以看到哪些CSS规则应用于每个元素以及覆盖它们的内容。您可以看到标题在main元素中的另一个div中，该div上有fc event-main类，并且该类有一个规则，该规则将再次覆盖color属性。

幸运的是，我们可以通过调整CSS规则来解决这个问题：

.fullcalendar_nearest_days, .fullcalendar_nearest_days .fc-event-main {
background-color: red !important;
color: yellow !important;
font-weight: bold;
}

工作演示：https://codepen.io/ADyson82/pen/OJmJPEP