使用 JSON 在完整日历上呈现事件

Question

我正在尝试通过构建一个 JSON 对象并将其传递给 Full Calendar 上的事件处理程序来在 Full calendar js 上呈现事件，代码如下：

$('#dailyPaymentsModal').on('show.bs.modal', function(event) {
  var button = $(event.relatedTarget) // Button that triggered the modal
  var matrixId = button.data('id');
  var matrixprice = button.data('price');
  var qualifiedDate = button.data('qdate');
  var qDate = new Date(qualifiedDate);
  var tomorrow = new Date(qualifiedDate);
  var endDate = new Date(qualifiedDate);
  endDate.setDate(endDate.getDate() + 14);
  tomorrow.setDate(tomorrow.getDate() + 1);
  var nextDay = qDate;
  var myObject = new Object();
  var myarray = [];
  var dailybonus = matrixprice * 0.03;
  while (nextDay <= endDate) {
    myObject.title = 'Daily Bonus';
    myObject.start = nextday;
    myObject.description = dailybonus;
    myarray.push(myObject);
    nextDay.setDate(nextDay.getDate() + 1);
  }
  var myString = JSON.stringify(myarray);
  alert(myString);
  var calendar = $('#fcalendar').fullCalendar({
    events: myString,
    displayEventTime: false,
    eventRender: function(event, element) {
      element.find('.fc-title').text(event.title);
    }
  });
})

我在 myString 中得到一个 JSON 数组，但是当传递给完整日历上的事件时，它不会呈现任何事件。

Answer 1

您不需要 JSON.stringify(myarray); 只需删除该行并在事件中使用 myarray。

// var myString = JSON.stringify(myarray);
// alert(myString);
var calendar = $('#fcalendar').fullCalendar({
   events: myarray,
   displayEventTime: false,
   eventRender: function(event, element) {
      element.find('.fc-title').text(event.title);
   }
});

备注 Fullcalendar 有一个非常好的演示，您可以简单地使用它们来构建您的演示。这是您可以使用的事件数据演示。 https://codepen.io/nasser-ali-karimi/pen/YzzdxWg?editors=0010

使用 JSON 在完整日历上呈现事件

Render events on Full calendar using JSON

arrays

jquery

json

fullcalendar