Changing view from month to week or day or agenda crashes the app react big calendar

Question

Bug: Changing view from month to week or day or agenda crashes the app. I suspect it is something to do with moment.

My code

import { Calendar, momentLocalizer } from "react-big-calendar";
import moment from "moment";
import "react-big-calendar/lib/css/react-big-calendar.css";

const localizer = momentLocalizer(moment);

const Calendars = () => {
 
  return (
    <div>
<Calendar events={events} startAccessor="start_date" endAccessor="end_date" defaultDate={ new Date()} localizer={localizer} />
    </div>
  );
};

Sample data

This is the data I am passing to calendar function

cost events = [
 {
  "title": "Work",
   "start_date": "2020-02-10T09:00:00.000Z",
   "end_date": "2020-02-10T11:00:00.000Z"
 },
 {
  "title": "Work",
  "start_date": "2020-02-08T09:00:00.000Z",
   "end_date": "2020-02-08T11:00:00.000Z"
 }
]

What could I be doing wrong?

Answer 1

you should convert "start_date" and "end_date" to js date object => moment(start_date).toDate()