Month Automatically jumping back to where it is being moved

[taatiq882]

Hello, I have this weird behavior, Can anyone here help me out with why is this happening? I have attached a vide.

        <RnMonthPicker
          onChange={onValueChangeEndingDate}
          autoTheme={false}
          value={new Date()}
          minimumDate={new Date()}
          maximumDate={new Date(2025, 5)}
          locale="en"
        />

https://user-images.githubusercontent.com/30371302/198722446-2ac9ccaf-537c-4fbf-b652-e251c762a5da.mov

[shahanshah87]

Hey did you find any solution?

[taatiq882]

Nop I couldn't find any solution for that.

[bkcan]

@taatiq882 You need to update the value prop. Refer to the Usage section

Pseudocode:

let currentDate = new Date() // use the useState hook so that the component re-renders

const onValueChangeEndingDate = (newDate) => {
  currentDate = newDate
}

........

<RnMonthPicker
  onChange={onValueChangeEndingDate}
  autoTheme={false}
  value={currentDate} // update this prop to the new chosen value
  minimumDate={new Date()}
  maximumDate={new Date(2025, 5)}
  locale="en"
/>

[gusparis]

@taatiq882 not a bug. you set the maximum date to June 2025, if you go pass that date, it will scroll back to the maximum. Remove maximumDate if it was not intended, or increase the limit date.