fullcalendar v4 info.event.start 显示的时间与日历中显示的时间不同
fullcallendar v4 info.event.start shows different time than displayed in calendar
日历(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 和 Bootstrap 4 Datetimepicker 之间的交互中,它将所有从 fullcalendar 事件读取的日期视为 UTC 时间。
将 Moments Timezone 添加到 fullcalendar 和 Datetimepicker 解决了这个问题。
日历(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 和 Bootstrap 4 Datetimepicker 之间的交互中,它将所有从 fullcalendar 事件读取的日期视为 UTC 时间。 将 Moments Timezone 添加到 fullcalendar 和 Datetimepicker 解决了这个问题。