完整日历中的自定义按钮不显示

Question

我在 FullCalendar 中遇到问题，我刚刚添加了customButtons这样的内容： customButtons: {    AddEvent: {    text: 'Add Event',    click: function () {     //Show Modal    }  }},但按钮不显示。我还检查了窗口中的元素，但它丢失了。这是我的整个 JavaScript 代码。 <script>        document.addEventListener('DOMContentLoaded', function () {            var calendarEl = document.getElementById('calendar');            var calendar;            var date = new Date;            initThemeChooser({                init: function (themeSystem) {                    calendar = new FullCalendar.Calendar(calendarEl, {                        schedulerLicenseKey: 'GPL-My-Project-Is-Open-Source',                        themeSystem: themeSystem,                        now: date,                        editable: true, // enable draggable events                        selectable: true,                        nowIndicator: true,                        aspectRatio: 1.8,                        scrollTime: '00:00', // undo default 6am scrollTime                        headerToolbar: {                            left: 'today prev,next',                            center: 'title',                            right: 'resourceTimelineDay,resourceTimelineThreeDays,timeGridWeek,dayGridMonth,listWeek'                        },                        customButtons: {                            AddEvent: {                                text: 'Add Event',                                click: function () {                                   // alert('Show Modal!');                                }                            }                        },                        initialView: 'dayGridMonth',                        views: {                            resourceTimelineThreeDays: {                                type: 'resourceTimeline',                                duration: { days: 3 },                                buttonText: '3 days'                            }                        },如何在完整日历上添加自定义按钮？

Answer 1

您创建了该按钮，但必须将其添加到标题菜单中的某个位置。目前 fullCalendar 不知道你想在哪里显示它。

文档中有一个示例：https://fullcalendar.io/docs/customButtons

var calendar = new Calendar(calendarEl, {

  customButtons: {

    myCustomButton: {

      text: 'custom!',

      click: function() {

        alert('clicked the custom button!');

      }

    }

  },

  headerToolbar: {

    left: 'prev,next today myCustomButton',

    center: 'title',

    right: 'dayGridMonth,timeGridWeek,timeGridDay'

  }

});