在我的react应用中,我试图将RRule应用于拖动到日历中的外部事件。
render() {
return (<>
<div className = "draggable-task"
id = 'my-unique-id'
key = 'my-unique-id'
data-event = {
`{"id": "my-unique-id", "title":"my event", "color": "#ffffff", "backgroundColor": "#000000", "duration": "00:30", "borderColor": "#000000" }`
}>My event </div>
<FullCalendar plugins = {[dayGridPlugin, timeGridPlugin, interactionPlugin, bootstrapPlugin, rrulePlugin]}
initialView = "timeGridWeek"
headerToolbar = {
{
start: 'title',
center: 'timeGridDay,timeGridWeek,dayGridMonth',
end: 'today prev,next'
}
}
droppable = {true}
editable = {true}
eventReceive = {(info) => this.onEventReceive(info)}
/>
</>)
}
componentDidMount() {
let draggableEl = document.getElementById('my-unique-id');
if (draggableEl) {
new Draggable(draggableEl);
}
}
onEventReceive(info) {
// set recurring properties
info.event.rrule = {
freq: 'daily',
interval: 1,
dtstart: info.event.startDate,
until: info.event.endDate
};
}
将事件拖动到日历后,该事件将正确添加到日历中,但不会出现重复发生的事件。