在 FullCalendar(v6) 中显示事件描述

问题描述 投票:0回答:1

目前使用完整的日历和来自谷歌日历的事件源,效果很好。我想将事件描述添加为工具提示或在事件标题旁边的列表视图中。我有一个关于鼠标输入工作的弹出窗口,但不知道如何包含描述。

2017 年的这个 问题表明是这样的:

      eventRender: function(event, element) {
                    element.description = event.description;
      },

还有这个问题表明:

 events: myevents,
                eventRender: function (event, element) {
                    element.attr('href', 'javascript:void(0);');
                    element.click(function() {
                        bootbox.alert({
                            message: 'Description : '+event.description,
                            title: event.title,
                        });
                    });
                }

这些想法可能有用,但我不知道如何将它们集成到解决方案中。

这是我当前的脚本,带有用于测试的 itemID 弹出窗口:

<script>
document.addEventListener('DOMContentLoaded', function() {
    var calendarEl = document.getElementById('calendar');
    var calendar = new FullCalendar.Calendar(calendarEl, {
      headerToolbar: {
        left: 'prev,next today',
        center: 'title',
        right: 'dayGridMonth,listMonth'
      },
eventMouseEnter: function (event) {
        alert('Event: ' + event.item.id);
},
      
      googleCalendarApiKey: 'A*******************************o',
      eventSources: [
 
        {
          googleCalendarId: 'k**************************[email protected]',
          color: 'rgb(246, 191, 38)',   // an option!
        }
        
      ],
      
      
      initialView: 'listMonth'
    });
    calendar.render();
  });

    </script>

任何帮助将不胜感激!

javascript fullcalendar google-calendar-api
1个回答
0
投票

好吧,我再看几个问题就解决了:

我替换了这个:

eventMouseEnter: function (event) {
    alert('Event: ' + event.item.id);

},

这个:

eventMouseEnter: function (info) {
    alert('Description: ' + info.event.extendedProps.description);

},

© www.soinside.com 2019 - 2024. All rights reserved.