Fullcalendar не перерисовывается после updateevents

Моя цель - иметь 2 разных элемента FullCalendar, которые будут синхронизироваться. На данный момент я не выполняю НИКАКИХ сетевых вызовов, а просто использую массивы на стороне клиента.

Когда я добавляю событие (скажем, щелчком мыши или сразу после его создания), календарь фактически не перерисовывается, как утверждается в документации.

Я также попытался использовать разновидности «renderEvents» и «renderEvent», но это кажется ненужным, поскольку «updateEvents» будет / должен обновлять отрисовку этих событий. Проблема, с которой я также столкнулся, заключается в том, что «renderEvent» в версии календаря со списком не показывает событие, которое я добавляю, если оно выходит за пределы этого календаря.

const events = [{
    title: 'All Day Event',
    start: TODAY
  },
  {
    title: 'Long Event',
    start: TODAY,
    end: NEXTDAY
  }
]

$("#calendar").fullCalendar({
  header: {
    left: '',
    center: 'title',
    right: ''
  },
  events
})

$("#events").fullCalendar({
  header: {
    left: '',
    center: 'title',
    right: ''
  },
  defaultView: 'listMonth',
  events
})

// Now add a new one
events.push([{
  title: 'Event added',
  start: YESTERDAY
}])

$('#calendar').fullCalendar('updateEvents', events)
$('#events').fullCalendar('updateEvents', events)

Вот воссоздание проблемы:

https://jsfiddle.net/Kikketer/7d92utp5/

Вариант использования довольно прост: добавить новое событие в список событий, отобразить события в календаре.

0
0
829
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

сначала измените свое событие push на объект из массива.

events.push({
   title: 'Event added',
   start: YESTERDAY
});

Теперь у вас есть много вариантов для этого. Я напишу вам 2 способа.

а.

$('#calendar').fullCalendar( 'removeEvents');
$('#calendar').fullCalendar('addEventSource', events);

https://jsfiddle.net/7d92utp5/49/

б. 1) Измените параметр События на функцию

$("#calendar").fullCalendar({
  header: {
    left: '',
    center: 'title',
    right: ''
  },
  // at here
  events: function (start, end, timezone, callback) {
    callback(events);
  }
});

2) Используйте refetchEvents вместо updateEvents

$('#calendar').fullCalendar('refetchEvents');

https://jsfiddle.net/7d92utp5/53/

Потрясающе это сработало. Вы или кто-нибудь знаете, что на самом деле делает fullcalendar.io/docs/updateEvents (updateEvents)?

Chris 14.09.2018 15:06

Он не может этого сделать. Вы можете прочитать документацию отсюда: ссылка Он может обновлять текущие события. Пример: название события изменилось.

akcoban 14.09.2018 20:02

Честно говоря, я взглянул на отдельные документы «события обновления», но, глядя на документы «события обновления», он ничего не сказал об обновлении ТОЛЬКО существующих. Возможно, просто ошибка в документации.

Chris 18.09.2018 15:35

Другие вопросы по теме