未捕获的类型错误：无法在完整日历中读取未定义的属性（读取“hasTime”）

Posted 2023-05-08

【中文标题】未捕获的类型错误：无法在完整日历中读取未定义的属性（读取“hasTime”）

【英文标题】：Uncaught TypeError: Cannot read properties of undefined (reading 'hasTime') in fullcalendar

【发布时间】：2021-11-07 00:25:33

【问题描述】：

在完整的日历显示中遇到错误。我从 servlet 收到以下格式的 JSON。

类型1：[["title2","2021-09-10","2021-09-10"],["title2","2021-09-10","2021-09-10"],

类型2：[["title2","2021-09-10","2021-09-10"],["title2","2021-09-10","2021-09-10"]]

这是我在 Google chrome 控制台中看到的错误：

我的代码：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.1/moment.min.js"></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.1.0/fullcalendar.js'></script>
<link rel='stylesheet' href="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.1.0/fullcalendar.min.css" />

<div id='calendar'></div>

$(document).ready(function() 
  var s = '';
  var value;
  var datavlue;
  
  $.ajax(
    url: 'CalendarEventController',
    dataType: "json",
    success: function(response) 
      console.log(response);
      value = response;

      s = '[';

      $.each(value, function(index, v) 
        s += '["' + v.title + '","' + v.start + '","' + v.end + '"],';
      );
      console.log(s);
      var d = s.slice(0, -1)
      d += ']';
      console.log(d);
      datavlue = JSON.parse(d);
      console.log(datavlue)
      $('#calendar').fullCalendar(
        // put your options and callbacks here
        left: 'Calendar',
        center: '',
        right: 'today prev,next',
        editable: true,
        events: [datavlue],
      )

    
  );
);

【问题讨论】：

我相信doc 表示事件是对象而不是列表

那么我必须更改我的代码吗？

使 datavlue 成为对象 title: 'title2', start: '2021-09-10', end: '2021-09-10'

发生同样的错误。

【参考方案1】：

如果您将 response 保留为 events 的值，则日历应该可以工作

$(document).ready(function() 
  var s = '';
  var value;
  var datavlue;
  
  var response = [title: 'title2', start: '2021-09-10',end:'2021-09-10', title: 'title2', start: '2021-09-10',end:'2021-09-10']
  
      $('#calendar').fullCalendar(
        // put your options and callbacks here
        left: 'Calendar',
        center: '',
        right: 'today prev,next',
        editable: true,
        events: response,
      )

    
);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.1/moment.min.js"></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.1.0/fullcalendar.js'></script>
<link rel='stylesheet' href="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.1.0/fullcalendar.min.css" />

<div id='calendar'></div>

【讨论】：

感谢上帝它有效。非常感谢@depperm