Question

日历（fullcalendar v4）以适当的时间显示事件，该时间是从数据库中读取的，并已调整为所需的时区。

我在12.00和14.00之间显示了事件。

日历初始化的一部分：

calendar = new FullCalendar.Calendar(calendarEl, {
    plugins: [ 'dayGrid', 'timeGrid', 'interaction' ],
    allDaySlot: false,
    selectable: true,
    timeZone: '<?php echo $calendar_timezone ?>',
    header: {
        left: 'prev,next today',
        center: 'title',
        right: 'dayGridMonth,timeGridWeek,timeGridDay'
    },
    defaultView: 'timeGridWeek',
    nowIndicator: true,
    slotDuration: '<?php echo $calendar_full_hours_only ?>',
    businessHours: {
        startTime: '08:00',
        endTime:   '19:00',
        daysOfWek:[1,2,3,4,5]
    },
}

JSON提要很好。事件在日历网格中正确显示：

[
{
"id": 53,
"title": "Test Event 12.00 - 14.00",
"start": "2019-11-19 12:00",
"end": "2019-11-19 14:00",
"allDay": 0,
"editable": 1
}
]

单击它会显示不同的时间。

eventClick: function(info) {
    console.log('Id: ' + info.event.id);
    console.log('Start: ' + info.event.start);
    console.log('End: ' + info.event.end);
    console.log('Calendar timezone: ' + '<?php echo $calendar_timezone ?>');
    console.log('Browser timezone: ' + Intl.DateTimeFormat().resolvedOptions().timeZone);
}

控制台中的输出为：

Id: 53
Start: Fri Nov 19 2019 13:00:00 GMT+0100 (czas środkowoeuropejski standardowy)
End: Fri Nov 19 2019 15:00:00 GMT+0100 (czas środkowoeuropejski standardowy)
Calendar timezone: Europe/Warsaw
Browser timezone: Europe/Warsaw

比日历显示的时间晚一小时。

更重要的是，如果将日历的时区更改为另一个时区，它将更正日历中显示的事件的时间，但是如果再次单击它们，它将在一个小时后显示时间。无法弄清楚正在发生什么。

我刚刚发现，如果我单击空插槽，则不会发生此问题。那么时间是正确的。仅当我单击现有事件时才会发生。

Answer 1

问题出在fullcalendar和Bootstrap 4 Datetimepicker之间的交互中，它将从fullcalendar事件读取的所有日期都视为UTC时间。在fullcalendar和Datetimepicker中添加Moments时区可以解决此问题。

fullcallendar v4 info.event.start显示的时间与日历中显示的时间不同

1 个答案: