Events not getting displayed at the right position

Question

Version - "react-big-calendar": "^0.28.2"

-

Screenshot attached

Please find below React code -

<Calendar
        defaultDate={moment().toDate()}
        defaultView="month"
        events={[{
          "status": "pending",
          start: new Date(2020, 10, 11, 10, 0),
          end: new Date(2020, 10, 11, 17, 0),
          "title": "Michael Scott",
          'allDay': false,
        }]}
        localizer={localizer}
        max={new Date(0, 0, 0, 21, 0, 0)}
        min={new Date(0, 0, 0, 7, 0, 0)}
        resizable
        selectable
        style={{ height: '80vh' }}
          />

Answer 1

You need format your date at Obj "events" by moment . Example:

events={[{
  "status": "pending",
  start: moment().toDate(new Date(2020, 10, 11, 10, 0)),
  end: moment().toDate(new Date(2020, 10, 11, 17, 0)),
  "title": "Michael Scott",
  'allDay': false,
}]}