The calendar is blank before it is scrolled

The code below works well, except a small bug.

The initial value of this.state.selectedDates is set to [Date.now()]. The calendar is blank before you scroll the calendar. If you scroll, the calendar appears, but you need to scroll from year 1980.

If you click the date in the calendar header, the calendar can auto scroll to today. How can I trigger this event when the component is mounted, please? Thanks a lot!

import {Calendar, defaultMultipleDateInterpolation} from 'react-infinite-calendar';
const MultipleDatesCalendar = withMultipleDates(Calendar);

render() {
  return (
    <MultipleDatesCalendar
      selected={this.state.selectedDates}
      onSelect={(selectedDate) => defaultMultipleDateInterpolation(selectedDate, this.state.selectedDates)}                                                                                                   
    />
  );
}

[clauderic]

I’m unable to reproduce what you’re describing.

Are you animating the display property of the Calendar and are you sure it has a height initially? If the header is properly displaying the selected date, I could be wrong, but this sounds like more of an implementation an issue on your end where the Calendar is trying to scrollTo the selected date but can’t because it doesn’t have a height or is set to display none.

[jiezhou0731]

Yes, sir. It is because I set display to “none” at the beginning. Thanks a lot!