问题描述
当我使用eventOrder在一天中对事件进行排序时,它可以正常工作。但是,如果我将活动安排在第二天,则第二天活动的顺序会更改第一天活动的顺序。
查看codepen链接以获取示例。第一天有四个活动。三是多日活动,一个是单日活动。我使用eventOrder对事件进行排序,将单日事件放在最后。如果我仅显示第1天的数据,则效果很好。但是,我添加了第二天。第2天还有4个活动(相同的3个多日活动和自己的单日活动)。我使用eventOrder对事件进行排序,将第2天的单日事件排序为第2天显示的第二个事件。
结果:第1天的单日事件(应该在第1天最后一次订购)浮动,成为第1天的第二个事件。日历需要在第一个多日事件下提供额外的空间,以便呈现第2天的单日事件,这是正确的。但是,日历不会在第1天留出空白,而是通过将Day 1单日事件显示到第二行而不是将其保留在其所属位置的最后一行来填充该空间。
如何将第一天的单日活动排序为第一天的最后一天?
document.addEventListener('DOMContentLoaded',function() {
var calendarEl = document.getElementById('calendar');
var calendar = new FullCalendar.Calendar(calendarEl,{
initialView: 'dayGridMonth',initialDate: '2020-08-07',headerToolbar: {
left: 'prev,next today',center: 'title',right: 'dayGridMonth,timeGridWeek,timeGridDay'
},eventOrder: 'order',events: [
{
title: 'All Day Event',start: '2020-07-01',end: '2020-07-30',extendedProps: {
order: '1'
}
},{
title: 'Under All Day',start: '2020-07-27T08:00:00',end: '2020-07-27T08:15:00',extendedProps: {
order: '2'
}
},{
title: 'Long Event',extendedProps: {
order: '3'
}
},{
title: 'Another Event',extendedProps: {
order: '4'
}
},{
title: 'Under Another',start: '2020-07-26T08:00:00',end: '2020-07-26T08:15:00',extendedProps: {
order: '5'
}
}
]
});
calendar.render();
});
解决方法
暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!
如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@)