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

【问题标题】：fullcallendar v4 info.event.start shows different time than displayed in calendarfullcalendar v4 info.event.start 显示的时间与日历中显示的时间不同
【发布时间】：2019-11-10 14:17:40
【问题描述】：

日历 (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

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

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

我刚刚发现如果我单击空插槽不会出现问题。那么时间就对了。仅当我单击现有事件时才会发生。

【问题讨论】：

您能否显示您提供给 fullCalendar 的原始 JSON 事件数据以显示此事件？而且...运行此程序时浏览器中的默认时区是什么？而且...您是否使用了 fullCalendar 的任何时区设置？请向我们提供minimal, reproducible example，以便我们能够充分理解和重现影响您所询问行为的所有因素。谢谢。
首先，感谢您的帮助。我从 mysql 读取数据，最奇怪的是它们以正确的时间显示。然后我点击它们，这样我就不会用我的代码对它们做任何事情，它们会显示错误的时间。同时，当我单击日历中的空槽时，它会显示正确的时间。有什么想法要检查或测试什么？
能和1h slotDuration有关吗？
不，slotDuration 完全无关
ADyson，谢谢你的线索。现在，无论安装哪个 TZ 服务器或从哪个 TZ 客户端连接，它都可以正常工作。谢谢。

标签： javascript timezone fullcalendar fullcalendar-4

【解决方案1】：

问题在于 fullcalendar 和 Bootstrap 4 Datetimepicker 之间的交互，它将从 fullcalendar 事件读取的所有日期视为 UTC 时间。将 Moments 时区添加到 fullcalendar 和 Datetimepicker 解决了这个问题。

【讨论】：

您能否详细说明您是如何解决这个问题的，因为我在使用 Fullcalendar 和 BS4 时遇到了同样的问题。谢谢
我正在转换日期：$dateTime_for_picker = new DateTime ($source_date_object_UTC->format(DATETIMEFORMAT_PHP), new DateTimeZone('UTC')); return $dateTime_for_picker->format('Y-m-d\TH:i:s.u\Z');，然后将其传递给 datetimepicker