-1

On the project i work now we decided to use react-big-calendar. I am supplying the events data by passing it from the parent component as a props. The data comes in format {start:"ISO date string",end:"ISO date string",title:"Event name", allDay:true/false,eventID:number, roomID:number, ownerID:number}. It was working with my dummy data (without eventID,roomID,ownerID).

So, what is actually breaking: When I chose a room/rooms, it renders all events by this room/rooms. This works in mount, and agenda view. I can navigate trough the toolbar. But when I try to change the view to week,work-week or day it has unpredictable behavior. If there is no event in the day, week, or work-week, it renders well, and navigates trough the toolbar. But if try to change it to week that got events,it is re-rendering the whole page and looses all rendered events. How can I fix this? If anyone can help or suggest what to look for?

Dimitar Daskalov
  • 73
  • 7
  • You should always post some code so others can see what you've tried and will gladly help – kivul Feb 12 '19 at 09:23
  • I am sorry for disturbing. I just passed the ISO Date string in to 'new Date("ISO Date String")' and It worked as a charm... That was the problem. – Dimitar Daskalov Feb 12 '19 at 09:27

1 Answers1

0

I had a very similar problem recently, and it was because I had forgotten to mutate all of my event start and end values to true JavaScript Date objects. That requirement is in the documentation, I had just forgotten it. Before I had done this they would still display initially, but things like changing the view, or drag n drop/resizing, would either completely break, or be highly problematic. Once I had properly converted those start and end dates to true JS Date objects, all of those issues went away.

Steve -Cutter- Blades
  • 5,057
  • 2
  • 26
  • 40