React-big-calendar: Events not showing up in react-big-calendar

[SCHKN]

I have a bug in my application, for me I did everything correctly, still the events won't show up in the calendar.

```import React, { Component } from 'react';
import BigCalendar from 'react-big-calendar';
import 'react-big-calendar/lib/css/react-big-calendar.css';
import moment from 'moment';
import localizer from 'react-big-calendar/lib/localizers/globalize'

class ProfileLeftPanel extends React.Component {
constructor(props) {
super(props);
BigCalendar.momentLocalizer(moment);
}
render(){
const events = [
{
title: 'All Day Event very long title',
startDate: new Date(2018, 1, 1),
endDate: new Date(2018, 1, 2),
},
]
return(

Container

{...this.props}
events={events}
views={['month', 'agenda']}
step={60}
defaultDate={new Date(2018, 3, 1)}
/>

)
}
}

export default ProfileLeftPanel
```

The event tab is completely empty. Thanks in advance!

[jquense]

You need to tell the calendar what the shape of your event object is via the various accessor props, or change your event to be the default values of them

[SCHKN]

Thanks.
Setting the startAccessor and the endAccessor solved the issue for me.

[8ctopotamus]

I have them set, but this still isn't working on Iphone safari for some reason. Working fine on Android chrome.

[mikailbayram]

@8ctopotamus have you solved the issue?

[8ctopotamus]

Hey @mikailbayram, I did solve my issue while ago. It had more to do with the output I was getting from The Events Calendar WordPress plugin. I believe I solved it by just using The Event Calendar's output and creating a new Date(). This is an example of one of my event objects, which is working in Safari:

{
      title: event.title.rendered,
      start: new Date(event.event_meta._EventStartDate[0].replace(' ', "T")),
      end: new Date(event.event_meta._EventEndDate[0].replace(' ', "T")),
      slug: event.slug,
}

What is the issue you are running into?

[mikailbayram]

@8ctopotamus I cant render my events on Safari, I realized that the issue is events coming later than Calendar render but it works on Chrome...

[8ctopotamus]

Can we see an example of your events array?

[mikailbayram]

I just solved it by changing my date format from

new Date(date)
moment(date)._d

Thanks anyway!

[Chinajiyong]

Can we see an example of your events array?

could you please take a look this issue?
https://github.com/intljusticemission/react-big-calendar/issues/1186#issue-401299974

[ZoharHedri]

@SCHKN

can you show please how do you solved the issue by setting the startAccessor and the endAccessor?
I didn't understand what you did.

Thanks