显示月份事件但不显示 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;
}