react-big-calendar navigate to specific day / month

Deano picture Deano · Feb 8, 2017 · Viewed 8.6k times · Source

I'm using BigCalendar react-big-calendar, and I'm trying to find an example on how to navigate to specific day / month when defaultDate state value changes.

<BigCalendar
        events={props.events}
        defaultDate={this.state.selectedDay}
/>

I’m wondering if BigCalendar calendar supports navigating into a specific day / month, the documentation include onNavigate prop, but I haven't been able make it work.

    <BigCalendar
      selectable
      events={events}
      defaultView='week'
      defaultDate={this.state.selectedDay}
      onNavigate={() => { this.state.selectedDay }}
    />

Thanks

Answer

monastic-panic picture monastic-panic · Feb 8, 2017

you don't want to use defaultDate in this case since you are controlling the value yourself

<BigCalendar
  selectable
  events={events}
  defaultView='week'
  date={this.state.selectedDay}
  onNavigate={date => {
    this.setState({ selectedDate: date });
  }}
/>

that will tell teh calendar, to always use the date you tell it to.