fullcalendar.js v4 - Как установить html в заголовке?

У кого-нибудь есть решение, как заставить FullCalendar.js v4 отображать заголовок в виде html? Все старые способы получения элемента и замены текста на html в новой версии не работают. Я пробовал это ниже:

eventRender: function(info) {
  return $.parseHTML(info.event.title);

Полуработает - Html отображается, но в нем отсутствуют остальные классы html в событии. Я предполагаю, что требуется изменить полный информационный объект, но установка этого не работает: eventRender: function(info) { info.event.title = info.el.innerText; вернуть информацию


javascript html fullcalendar fullcalendar-4
person John Greer    schedule 08.05.2019    source источник
comment
Ищите эквивалент этого в версии 4 в файле eventRender. v2: element.find('.fc-content').html( '‹div›html text or image‹/div›' );   -  person John Greer    schedule 08.05.2019

Ответы (1)


arrow_upward
23
arrow_downward

Поскольку fullCalendar v4 больше не использует jQuery, элемент HTML, который предоставляется во время eventRender, теперь является стандартным элементом JS DOM. объект, как и все элементы, поставляемые через обратные вызовы и методы v4. См. https://fullcalendar.io/docs/upgrading-from-v3 для получения дополнительной информации. .

Это означает, что вы можете использовать стандартные методы JavaScript DOM для управления им. Например, вы можете сделать что-то подобное, чтобы заголовок отображался курсивом:

eventRender: function(info) {
  info.el.querySelector('.fc-title').innerHTML = "<i>" + info.event.title + "</i>";
}

Демонстрация: https://codepen.io/anon/pen/XwmgLR?editors=1010

person ADyson    schedule 08.05.2019
comment
Это работает, но HTML иногда может искажать выходные данные HTML, которые генерирует fullcalender, вызывая ошибку JSON при синтаксическом анализе сбоя (в моем случае это происходит при смене представления). Если кто-то еще получит эту ошибку, я решил адаптировать это решение stackoverflow.com/a/60061879/3075616 - person z3d0; 16.05.2020