如何获取 FullCalendar v5 的 eventContent 中的元素并将其分配给小费？

Question

我从 v4 进入 FullCalendar v5，并尝试为任何单元格设置提示。在 v4 中，我使用了 eventRender，例如：

            eventRender: function (eventInfo) {
                let external_google_calendar_button = ""
                if (eventInfo.event.url != "" && typeof eventInfo.event.url != "undefined") {
                    // alert( eventInfo.event.url + "  eventInfo.event..url ::"+( typeof eventInfo.event.url )  )
                    external_google_calendar_button = '<i class=\'fa fa-external-link\' style=\'color:#eaeaea;\' title=\'Has event at Google Calendar\'></i>&nbsp;';
                }
                let adTooltipHtml = '..."

                let editorBtnHTML= '<button type="button" class="action_btn m-0 mr-1 p-0 px-1" @click.prevent="openAdCard( \'' + eventInfo.event.id + '\' )" title="Open ad card">+</button>'


                eventInfo.el.querySelector('.fc-content').innerHTML = '<span class="flex flex-nowrap">'+editorBtnHTML +  eventInfo.el.querySelector('.fc-content').innerHTML + '</span>'

                tippy(eventInfo.el, {
                    content: adTooltipHtml,
                    allowHTML: true,
                    animation: 'fade',
                    delay: 100,
                    duration: 100,
                });

这里 https://fullcalendar.io/docs/event-render-hooks 我读了 :

eventContent - a Content Injection Input. Generated content is inserted inside the inner-most wrapper of the event element. If supplied as a callback function, it is called every time the associated event data changes.

我尝试使用 eventContent 事件来实现相同的目标：

eventContent: function (eventInfo) {
    console.log('eventContent eventInfo::')
    console.log(eventInfo)
    console.log('eventInfo.event::')
    console.log(eventInfo.event)

但我无法访问元素以对其设置提示。我在浏览器控制台中看到的内容：https://imgur.com/a/8CCgZ4i

如何获取我必须分配小费的元素？

谢谢！

Answer 1

I failed to get access to element

...是的，因为根据 [内容注入文档] (https://fullcalendar.io/docs/content-injection)，您无法直接访问它。您只需 return 您想要放入其中的 HTML，无需了解您要注入的元素的任何信息。

然而，这并不是您真正要在此处执行的操作 - 您正在尝试将工具提示附加到整个元素。

再次根据 event render hooks documentation，如果您改用 eventDidMount 回调，这使您可以访问所提供数据中的 el 属性，它表示元素。

如何获取 FullCalendar v5 的 eventContent 中的元素并将其分配给小费？

How to get element in eventContent of FullCalendar v5 and to assign it to tip?

javascript

html

fullcalendar

fullcalendar-5