Блог

Я пытаюсь добавить некоторые значки в заголовок в виде кнопок, я пробовал использовать как bootstrap, так и fontawesome, как указано в документах, но вместо значка я получаю пустой квадрат. При использовании темы начальной загрузки я получаю ‘undefined’, при использовании стандарта я получаю следующее.

Вот мой код:

 
const customButtons = { 
    custom1: { 
        icon: "fa-times", 
        click: function() { 
            alert('test');
        }
    }
} 

<CustomCalendar
       customCalendarRef={customCalendarRef}
       select={(e: any) => processClick(e)}
       customButtons={customButtons}
       themeSystem="standard"
       header={{
             right: '',
             center: '',
             left: 'prev,next today custom1'
       }}
/>

  

Результат:

Как я могу отобразить значок в виде кнопки в заголовке?

Я также использую fullcalendar в своем приложении react, поэтому я попытался использовать ваш код. Во-первых, вы забыли одну вещь, для которой fontawesome icons также нужен класс «fa», поэтому правильным было бы fa fa-times , а не только fa-times .

Но тогда есть еще одна проблема, которая заключается в том, что значок поставляется с пользовательскими классами fullcalendar при визуализации:

Таким образом, решение, которое вы могли бы использовать, — это добавить это где-нибудь в свой css:

 .fc-icon.fa {
   font: normal normal normal 14px/1 FontAwesome !important;
}
  

У меня это сработало:

Отредактировано:

Строка классов fontawesome должна начинаться с пробела, иначе класс ‘fa’ будет объединен с классом fullcalendar. Итак: icon: ' fa fa-times'