加载 2 个 JSON 事件源的不稳定行为（一个必须是后台事件）

Question

当我加载两个事件时，我收到了一个不稳定的事件行为，eventSources其中一个被定义为渲染：背景。

生成的 JSON 是正确的，因为在eventSources使用正常渲染定义两者时，一切正常。

指示的行为包括以下症状：

• 一些未呈现的事件（它们总是从不是背景的日历中消失，也不会出现在 DOM 中）

• 显示为正常事件的后台事件

• 在每次按下上一个/下一个时，行为可能会有所不同。

这是我加载事件的代码：

$('#workshifts_ocupations_calendar').fullCalendar({
  defaultView: 'agendaWeek',
  eventSources: [
    {
      id: "workshiftSource", 
      url: '<?= base_url(); ?>turno/ajax_load_workshifts_by_installation/'+installation,
      editable:true,
      success: function(){
        console.log("turnos");
      }
    },
    {
      id: "backSource",
      url: '<?= base_url(); ?>ocupacion/ajax_load_ocupations_by_installation/'+installation,
      rendering: 'background',
      editable:false,
      success: function(){
        console.log("fondos");
      }
    }
  ],
  eventRender: function(event, element) {
    // Si es background - Mostramos el título.
    if(event.source.rendering == "background"){
      element.html('<span class="backgroundEventsTitle">' + event.title + "</span>");
    }
  },
  locale: 'es',
  themeSystem: 'bootstrap3',
  minTime: '07:00:00',
  maxTime: '23:00:00',
  slotDuration: '00:15:00',
  slotLabelInterval: '00:30:00',
  slotLabelFormat: 'H:mm',
  selectable: true,
  allDaySlot: false,
  selectConstraint:{
    start: '07:00',
    end: '23:00',
  },
  eventConstraint:{
    start: '07:00',
    end: '23:00',
  },
  header: {
    left: 'prev,next today',
    center: 'title',
    right: 'month,agendaWeek,agendaDay'
  }

});

此处附上错误的屏幕截图，生成按下一步和预览按钮（无重新加载页面）。

行为1：

行为2：

重复：如果我在两个事件源中都使用正常渲染，则不会发生此问题。

全日历 v3.9.0

这是背景 JSON

这是正常的事件 JSON

Answer 1

好的，我找到了。

您的两个数据源之间存在 ID 冲突。在“正常”（非后台）数据中，您有 5 个 ID 为 1 到 5 的事件。在“后台”源中，您还有 4 个 ID 为 2 到 5 的事件。这些事件与其他数据源中的 ID 冲突。这似乎会导致 fullCalendar 感到困惑，并假设这些事件链接到具有相同 ID 的“正常”数据源中的事件，因此似乎决定它们不能呈现为后台事件。

我不完全确定这是否是 fullCalendar 中的错误 - 你必须询问程序员他们的意图是什么。在 fullCalendar 中当然可以有多个具有相同 ID 的事件，并且在某些情况下这很有用。

但是，如果像您的情况一样，这些事件完全不相关，那么为它们提供相同的 ID 可能不是一个好主意。一旦你改变了ID，问题就消失了：

修改后台事件的示例：

{
    "id": "2000",
    "title": "At. Balearicus (perpe lui)",
    "backgroundColor": "#FF40D1",
    "borderColor": "#eb2cbd",
    "start": "2018-08-20 09:00:00",
    "end": "2018-08-20 10:00:00"
},
{
    "id": "3000",
    "title": "At. Balearicus (perpe lui)",
    "backgroundColor": "#FF40D1",
    "borderColor": "#eb2cbd",
    "start": "2018-08-27 09:00:00",
    "end": "2018-08-27 10:00:00"
},
{
    "id": "40000",
    "title": "At. Balearicus (perpe lui)",
    "backgroundColor": "#FF40D1",
    "borderColor": "#eb2cbd",
    "start": "2018-09-03 09:00:00",
    "end": "2018-09-03 10:00:00"
},
{
    "id": "5000",
    "title": "At. Balearicus (perpe lui)",
    "backgroundColor": "#FF40D1",
    "borderColor": "#eb2cbd",
    "start": "2018-09-10 09:00:00",
    "end": "2018-09-10 10:00:00"
},

工作演示位于：http://jsfiddle.net/qxLuLhsf/135/