title: React Fullcalendar v4 tooltip
body: <p>Fullcalendar React component: </p>
  
  <pre><code>import FullCalendar from "@fullcalendar/react";
  import timeGrid from "@fullcalendar/resource-timegrid";
  import resourceDayGridPlugin from '@fullcalendar/resource-daygrid';
  
  class FC extends React.Component {
    calendarComponentRef = React.createRef();
  
    constructor(props) {
      super(props);    
      this.state = {
          events:[{ "id": 1, "title": "event 1", "description":"some description"},......]
      }  
    }
  
    eventRender(info){
      var tooltip = new Tooltip(info.el, {
        title: info.event.extendedProps.description,
        placement: 'top',
        trigger: 'hover',
        container: 'body'
      });
    }
  
    render() {
      return &lt;FullCalendar                  
            events={this.state.getEvents}          
            defaultView="resourceTimeGridDay"
        plugins={[timeGrid, interactionPlugin, resourceDayGridPlugin]}
            eventRender={this.eventRender}
            schedulerLicenseKey="GPL-My-Project-Is-Open-Source"
          /&gt;
  
    }
  }
  </code></pre>
  
  <p>Tooltip.js included in header </p>
  
  <pre><code>&lt;script src="https://unpkg.com/popper.js/dist/umd/popper.min.js"&gt;&lt;/script&gt;
  &lt;script rc="https://unpkg.com/tooltip.js/dist/umd/tooltip.min.js"&gt;/script&gt;
  </code></pre>
  
  <p>Exactly trying to this <a href="https://fullcalendar.io/docs/event-tooltip-demo" rel="noreferrer">demo</a> in react, but it is not working in react version. </p>
  
  <p>But tooltip not working</p>
  
  <p>Fullcalendar react example project <a href="https://github.com/fullcalendar/fullcalendar-example-projects/blob/master/react/src/DemoApp.jsx" rel="noreferrer">sample project react fullcalendar</a></p>