React DatePicker date & time saving error

https://www.npmjs.com/package/react-datepicker

react-datepicker

I was using React DatePicker to take date and time input.

Then a problem came up. The calendar modal is set to close when you pick a time after picking a date, and when I picked the time at that point, the date I had picked before was reset.

To fix this, I searched Google and asked ChatGPT too, but I didn't get an answer.

I followed the date & time example in the official docs exactly, and it worked, which is how I found the cause.

When I created a state that stores the date when onChange fires and managed it there, I could see the date come out correctly.

1
2
3
4
5
6
7
8
9const [saleDate, setSaleDate] = useState<null | Date>(null);

onChange={(date) => {
            console.log(date), setSaleDate(date);
            dispatch({
                 type: 'setTestDate',
                 payload: format(new Date(date!), 'yyyy-MM-dd HH:mm'),
            });
}}