我正在使用antd进行react-fullcalendar,因此我想在单击事件时显示弹出窗口。
为此,我编写了以下代码。
import React, { Component } from 'react'
import $ from 'jquery';
import FullCalendar from "@fullcalendar/react";
export default class ScheduleCalendar extends Component {
calendarComponentRef = React.createRef();
state = {
eventsList: [
{ title: "Event", start: new Date() }
]
};
render() {
return (
<div>
<div class="hide" id="popoverContent"></div>
<FullCalendar
plugins={[dayGridPlugin, interactionPlugin]}
ref={this.calendarComponentRef}
events={this.state.eventsList}
eventClick={function(calEvent) {
$(calEvent.jsEvent.target).popover({
title: "Hii",
content: function () {
$("#popoverContent").append(`<div</div>`);
return $("#popoverContent").html();
},
container: 'body'
}).popover('show');
}}
/>
</div>
)
}
}