完整日历 - 无法读取未定义的属性'DayGrid'

Question

我想在我的网站上使用Fullcalendar 4.2.0 插件，但我收到一条错误消息：

未

捕获的类型错误：无法读取未定义的属性"DayGrid">

包含的 js 文件：

<script src="include/plugins/fullcalendar-4.2.0/packages/core/main.min.js"></script>
<script src="include/plugins/fullcalendar-4.2.0/packages/core/locales-all.min.js"></script>
<script src="include/plugins/fullcalendar-4.2.0/packages/timegrid/main.min.js"></script>
<script src="include/plugins/fullcalendar-4.2.0/packages/interaction/main.min.js"></script>
<script src="include/plugins/fullcalendar-4.2.0/packages/bootstrap/main.min.js"></script>
<script src="include/plugins/fullcalendar-4.2.0/packages/daygrid/main.min.js"></script>
<script src="include/plugins/fullcalendar-4.2.0/packages/list/main.min.js"></script>

javascript 调用者代码：

<script>
var calendar;
$(document).ready(function() {
var calendarEl = document.getElementById('calendar');
calendar = new FullCalendar.Calendar(calendarEl, {
plugins: [ 'interaction', 'dayGrid', 'timeGrid', 'list' ],
defaultView: 'timeGridWeek',
locale: 'hu',
height: "auto"
});
calendar.render();
});
</script>
<div id="calendar"></div>

我尝试了更多的托管服务提供商的这段代码，它运行良好，除了一个。不幸的是，这是主要的托管服务提供商。他们不知道问题是什么。

我还没有在任何网站上找到解决方案。

请帮忙！

完整的错误消息是：

Uncaught TypeError: Cannot read property 'DayGrid' of undefined
at n [as constructor] (main.min.js:20)
at new n (main.min.js:20)
at CalendarComponent.renderView (main.min.js:6232)
at CalendarComponent.render (main.min.js:6184)
at CalendarComponent.Component.receiveProps (main.min.js:3887)
at Calendar.renderComponent (main.min.js:6795)
at Calendar.executeRender (main.min.js:6755)
at Calendar.render (main.min.js:6577)
at HTMLDocument.<anonymous> (calendar.php:45)
at l (jquery-3.3.1.min.js:2)

Answer 1

我设法在此演示中重现了您的错误：https://codepen.io/ADyson82/pen/KKppyxq

由于堆栈跟踪显示错误发生在"timegrid.min.js"中，因此很容易推断timeGrid插件似乎依赖于dayGrid插件。果然，更改文件的加载顺序，以便在 timeGrid 之前加载 dayGrid 可以解决此问题。

因此，只需像这样订购文件：

<script src="include/plugins/fullcalendar-4.2.0/packages/core/main.min.js"></script>
<script src="include/plugins/fullcalendar-4.2.0/packages/core/locales-all.min.js"</script>
<script src="include/plugins/fullcalendar-4.2.0/packages/daygrid/main.min.js"></script>
<script src="include/plugins/fullcalendar-4.2.0/packages/timegrid/main.min.js"></script>
<script src="include/plugins/fullcalendar-4.2.0/packages/interaction/main.min.js"</script>
<script src="include/plugins/fullcalendar-4.2.0/packages/bootstrap/main.min.js"></script>
<script src="include/plugins/fullcalendar-4.2.0/packages/list/main.min.js"></script>

演示：https://codepen.io/ADyson82/pen/QWbbOJv

我还发现这个依赖项实际上在完整的日历文档中提到：https://fullcalendar.io/docs/timegrid-view(尽管令人讨厌的是，它没有在 https://fullcalendar.io/docs/plugin-index 的插件列表中提及(。