TypeError: undefined is not an object (evaluating 'datesList[_this.state.numVisibleDays - 1].date')

[gustavomanolo]

HI, i've added a calendar strip instance like this:

<CalendarStrip style={{ height: 100, paddingTop: 10, paddingBottom: 10 }} minDate={moment()} maxDate={moment().add(10, "days")} datesBlacklist={(date) => { return (date.isoWeekday() === 6 || date.isoWeekday() === 7); }} />

But i'm getting an error: TypeError: undefined is not an object (evaluating 'datesList[_this.state.numVisibleDays - 1].date')

If i remove the "datesBlacklist" property, it works but i need to disable saturdays and sundays.

I'm using version => "react-native-calendar-strip": "^2.2.3"

Thanks in advance.

[peacechen]

Are you passing in another other props? Does your code work with the sample app? https://github.com/BugiDev/react-native-calendar-strip#development-with-sample-application

[phatmann]

This is a dup of #262. This error occurs when componentDidUpdate is called before onLayout is called. onLayout is where the numVisibleDays state is set. I am not using scrollable. I can get this error to happen 100% of the time by showing a screen with CalendarStrip, going to another screen, and coming back to the screen with CalendarStrip. If I don't use datesWhitelist then the error does not occur.

[phatmann]

More details: if the datesWhitelist property is changed several times very quickly, then componentDidUpdate ends up firing before onLayout is called. In my code, the bug happens when it changes 3 times in a row. Maybe reasonable defaults for all the state properties can be set before the measurements are done.

[phatmann]

Here is a possible fix: stop componentDidUpdate from being called until layout is done. I places these lines at beginning of componentDidUpdate and the problem went away:

    if (!this.state.dayComponentWidth) {
      return
    }

I am not sure if this will cause other problems or not, which is why I will not submit a PR with this fix yet.

[mtimofiiv]

@phatmann I made a PR out of your suggested fix, which also worked for me. https://github.com/BugiDev/react-native-calendar-strip/pull/314

[peacechen]

Thanks @mtimofiiv and @phatmann for identifying the issue.

That change will likely cause undesirable side effects, and is a band-aid for the root problem. Please revert that change in the PR and instead add this to the state initializer: https://github.com/BugiDev/react-native-calendar-strip/blob/master/src/CalendarStrip.js#L142

    this.state = {
      startingDate,
      selectedDate,
      datesList: [],
      dayComponentWidth: 0,
      height: 0,
      monthFontSize: 0,
      selectorSize: 0,
      numVisibleDays: props.numDaysInWeek,
    };

[mtimofiiv]

@peacechen you're right. I've updated the PR by reverting the old change and adding the initial state as you suggested.

[peacechen]

Thanks again @mtimofiiv for updating the PR. The fix has been published in 2.2.4

[mtimofiiv]

Hmm, the fix has not seemed to work, still getting the same error on 2.2.4. I can look into this a bit further later.

[phatmann]

This fix caused other issues for me. I decided not to use it. I can look into it if needed.

[Marcoo09]

In 2.2.5 I have not this problem anymore