Hacker0x01 / react-datepicker

A simple and reusable datepicker component for React
https://reactdatepicker.com/
MIT License
8.1k stars 2.24k forks source link

Staying at the current month when selecting range. #3583

Open ymoon715 opened 2 years ago

ymoon715 commented 2 years ago

Is your feature request related to a problem? Please describe. I currently have time range picker, where a user selects either yearly/monthly, and if they select today's date, it automatically chooses the range from today's to either year ago or month ago. However when that happens, the month automatically changes to a month/year ago and there is no way for me to control that.

Describe the solution you'd like A call back that I can use to control the year and the month im displaying, or a prop that prevents automatic change of year and date.

Describe alternatives you've considered I went through the doc and tried to change this in custom header, but so far no luck.

Additional context Is there any way to do this without using a hacky method like setTimeout?

ymoon715 commented 2 years ago

Currently, I'm using set time out, and the UI flickers to the current month/date after selecting dates beyond/below the current date.

Is there plans of creating headless react hooks that we can use to create the calendar and allow more customizations?

un1tT commented 2 years ago

@ymoon715 would you please share an example of your setTimeOut solution? Got this problem as well :/

ymoon715 commented 2 years ago

@ymoon715 would you please share an example of your setTimeOut solution? Got this problem as well :/

useEffect(() => { setTimeout(() => { if (to) { changeMonth(to.getMonth()); changeYear(to.getFullYear()); } }, 0); }, [frequency, from]);

The UI flickers, and this is probably the most brute force way you can achieve this. I dont recommend using setTimeout at all

github-actions[bot] commented 4 months ago

This issue is stale because it has been open 180 days with no activity. Remove stale label or comment or this will be closed in 10 days.