gpt4 book ai didi

javascript - 在 fullCalendar 4 和 React 中设置 eventRender

转载 作者:行者123 更新时间:2023-12-05 06:19:30 24 4
gpt4 key购买 nike

在与 jquery 一起使用的 fullCalendar 中,我有这个 eventRender:

    eventRender: function (event, element, view) {
if (event.finito == 0) {
element.css('background-color', '#FF0000');
}
},

我正在尝试使用 React 设置相同的东西。我试过这个但它不起作用:我还尝试了在网上和官方网站上找到的其他各种代码示例,但都没有用。

customEventRender = info => {
info.el.className = "red";
info.el.children[0].className = "red";
return info.el
};

<FullCalendar events={this.state.events}
weekends={true}
options={this.state.fullcalendarOptions}
eventRender={this.customEventRender}
>
</FullCalendar>

最佳答案

我找到了这个解决方案。

在 fullCalendar 4 中,自定义属性存储在事件对象的 extendedProps 属性中(参见 https://fullcalendar.io/docs/event-parsing)。

this.state = {
fullcalendarOptions: {
plugins: [dayGridPlugin, timeGridPlugin, interactionPlugin],
firstDay: 1,
editable: false,
defaultDate: new Date(),
header: {
left: 'prev,next today',
center: 'title',
right: 'month,agendaWeek,agendaDay'
},
eventClick: (info) => {
console.log(info.event.id);
// document.location.href = 'up.php?id=' + calEvent.id;
},
eventRender: function (info) {
if (info.event.extendedProps.finito == 0) {
info.el.style.backgroundColor = "#FF0000";
}
}
},
events: []
};

关于javascript - 在 fullCalendar 4 和 React 中设置 eventRender,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60827311/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com