显示月份事件但不显示 week/day 时间网格的完整日历
Full calendar showing events on month but not week/day timegrid
我正在尝试使用完整日历。使用月视图时,我每天都成功呈现事件。但是,当我切换到周时间网格或日时间网格时,即使事件显示正确的开始时间,事件也不会在周时间网格或日时间网格上呈现。
这是我创建数组的 php 代码:
$events = array();
foreach ($todos as $event) {
array_push($events, ['title' => $event->content, 'start' => $event->view_date.'T'.$event->appointment_time, 'backgroundColor' => $event->typeColor($event->type)]);
}
这是 php returns 当我控制台记录 $events
:
Array(3)
0:
title: "Test of the voice integration system"
start: "2020-02-21T07:15:00"
backgroundColor: "#b1b3b1"
allDay: false
1:
title: "Test"
start: "2020-02-21T10:14:00"
backgroundColor: "#b1b3b1"
allDay: false
这是我的完整日历设置:
<script src="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/4.2.0/core/main.min.js" integrity="sha256-GBryZPfVv8G3K1Lu2QwcqQXAO4Szv4xlY4B/ftvyoMI=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/4.2.0/daygrid/main.min.js" integrity="sha256-FT1eN+60LmWX0J8P25UuTjEEE0ZYvpC07nnU6oFKFuI=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/4.2.0/interaction/main.min.js" integrity="sha256-MUHmW5oHmLLsvmMWBO8gVtKYrjVwUSFau6pRXu8dtnA=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/4.2.0/timegrid/main.min.js" integrity="sha256-L9T+qE3Ms6Rsuxl+KwLST6a3R/2o6m33zB5mR2KyPjU=" crossorigin="anonymous"></script>
<script>
var calendarEl = document.getElementById('calendar');
var calendar = new FullCalendar.Calendar(calendarEl, {
plugins: [ 'dayGrid',
'interaction',
'timeGrid'
],
header: {
left: 'prev,next today',
center: 'title',
right: 'dayGridMonth, timeGridWeek, timeGridDay'
},
events: {!!json_encode($events)!!},
height: "auto",
eventClick: function(info){console.log(info)}
});
calendar.render();
</script>
所以我正在创建一个数组,然后将它发送到我的视图并将事件参数分配为该数组的值。如果日历在月视图上正确呈现它,我做错了什么以至于它没有在周视图或日视图上呈现?
试试这个,可能会有帮助
[{'title': 'Successful','allDay': false,'start': 1266398223,'end': 1266398266,'url': '/shlk/cgi-bin/getshlkrunlog.pl?i=21'}]
尽管检查语法
或使用 JS
$('#calendar').fullCalendar({
...
allDayDefault: false,
...
});
或者如果它是 css 问题添加以下内容
table td
{
overflow: inherit !important;
}
我正在尝试使用完整日历。使用月视图时,我每天都成功呈现事件。但是,当我切换到周时间网格或日时间网格时,即使事件显示正确的开始时间,事件也不会在周时间网格或日时间网格上呈现。
这是我创建数组的 php 代码:
$events = array();
foreach ($todos as $event) {
array_push($events, ['title' => $event->content, 'start' => $event->view_date.'T'.$event->appointment_time, 'backgroundColor' => $event->typeColor($event->type)]);
}
这是 php returns 当我控制台记录 $events
:
Array(3)
0:
title: "Test of the voice integration system"
start: "2020-02-21T07:15:00"
backgroundColor: "#b1b3b1"
allDay: false
1:
title: "Test"
start: "2020-02-21T10:14:00"
backgroundColor: "#b1b3b1"
allDay: false
这是我的完整日历设置:
<script src="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/4.2.0/core/main.min.js" integrity="sha256-GBryZPfVv8G3K1Lu2QwcqQXAO4Szv4xlY4B/ftvyoMI=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/4.2.0/daygrid/main.min.js" integrity="sha256-FT1eN+60LmWX0J8P25UuTjEEE0ZYvpC07nnU6oFKFuI=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/4.2.0/interaction/main.min.js" integrity="sha256-MUHmW5oHmLLsvmMWBO8gVtKYrjVwUSFau6pRXu8dtnA=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/4.2.0/timegrid/main.min.js" integrity="sha256-L9T+qE3Ms6Rsuxl+KwLST6a3R/2o6m33zB5mR2KyPjU=" crossorigin="anonymous"></script>
<script>
var calendarEl = document.getElementById('calendar');
var calendar = new FullCalendar.Calendar(calendarEl, {
plugins: [ 'dayGrid',
'interaction',
'timeGrid'
],
header: {
left: 'prev,next today',
center: 'title',
right: 'dayGridMonth, timeGridWeek, timeGridDay'
},
events: {!!json_encode($events)!!},
height: "auto",
eventClick: function(info){console.log(info)}
});
calendar.render();
</script>
所以我正在创建一个数组,然后将它发送到我的视图并将事件参数分配为该数组的值。如果日历在月视图上正确呈现它,我做错了什么以至于它没有在周视图或日视图上呈现?
试试这个,可能会有帮助
[{'title': 'Successful','allDay': false,'start': 1266398223,'end': 1266398266,'url': '/shlk/cgi-bin/getshlkrunlog.pl?i=21'}]
尽管检查语法
或使用 JS
$('#calendar').fullCalendar({
...
allDayDefault: false,
...
});
或者如果它是 css 问题添加以下内容
table td
{
overflow: inherit !important;
}