为什么 fullcalendar 解析 JSON 失败？

Question

总结

我已经设置了 fullcalendar，我正在尝试使用 JSON 事件源在其中显示数据，如他们的文档 here 中所述。

我不断收到以下失败消息Failure parsing JSON。

我尝试过的事情

这是将触发失败消息[{"title":"Lorem Ipsum","start":"2019-04-01","end":"2019-04-02"},{"title":"The Test","start":"2018-09-01","end":"2018-09-02"}]的JSON

我使用的是全日历版本 4.0.2。
我已经验证了我的 PHP 代码在 linter 中返回的 json。
我在 json 响应中添加了一个 Content-Type: application/json 标头。
我尝试使用 eventDataTransform 钩子返回在 fullcalendar 文档 here 中找到的一些示例 JSON（请参阅编辑历史记录中的代码）

~~奇怪的是，当我将上面的 JSON 直接放在我的 javascript 中的 events 选项中时，它确实有效。~~ 编辑：正如 Jaromanda X 和 Quentin 所指出的，这是一个 javascript 数组而不是 JSON .

代码

    var calendar = new FullCalendar.Calendar(calendarEl, {
        plugins: [ 'dayGrid' ],
        defaultView: 'dayGridMonth',
        locale: 'nl',
        events: '/fullcalendar/json.php'
    });

我希望我的 json 可以被解析，因为响应与我直接提供给 events 选项的响应相同

其他信息

json.php 文件的内容

<?php
header('Content-Type: application/json');
echo json_encode([
    [
        'title' => 'Lorem Ipsum',
        'start' =>  '2019-04-01',
        'end' =>  '2018-04-02'
    ],
    [
        'title' => 'The Test',
        'start' =>  '2018-09-01',
        'end' =>  '2018-09-02'
    ]
]);exit;

我尝试将方法更改为 GET，但没有帮助。

我附上了我在检查员JSON response in inspector的网络选项卡中看到的响应的屏幕截图

Answer 1

恐怕我的解决方案可能对其他人没有多大用处，但就是这样。

错误是由于我们的主js文件中的以下js代码引起的。

  if($('table').length > 0){
         $('table').wrap('<div class="table-scroll"></div>');
    }

这一行与 fullcalender 生成的 HTML 输出混淆，然后引发 failure parsing json 错误。

Answer 2

我在 php 页面中尝试了您的代码，并以 events: '/fullcalendar/json.php' 的形式调用了 fullcalendar，我不知道是什么导致了您的问题。 完美运行。

<?php
 header('Content-Type: application/json');
 echo json_encode([
   [
    'title' => 'Lorem Ipsum',
    'start' =>  '2019-04-16T13:00:00',
    'end' =>  '2019-04-17T14:00:00'
   ],
   [
    'title' => 'The Test',
    'start' =>  '2019-04-16T10:00:00',
    'end' =>  '2019-04-17T13:00:00'
   ]
]);

不过，也要考虑您的日期。您的起点是 2019 年，终点是 2018 年。还要插入时间以查看您的活动在哪里。