dateFormat in react date picker doesn't work

Question

i wish to get the date in the format yyyy/MM/dd but it doesn't seem to work when i console.log the value

<DatePicker dateFormat='dd/MM/yyyy' selected={startDate} onChange={(date)=>{
          setStartDate(date)
          console.log(startDate)
        }}/>

i get the following format

Fri Dec 31 2021 18:10:31 GMT+0530 (India Standard Time)

i will want in the form yyyy-mm-dd to finally insert the date into a sql table

i can see that format in the date-picker component but when console.log then it shows a different format or it will be useful even if it possible to get the value shown directly like e.target.value

Answer 1

The dateFormat prop controls how the date is displayed in the input field next to the date picker.

The actual value of the date picker will still be a Date object.

There are various ways of getting only the date (in a specific format) form this date.

I would suggest applying one of these for example (.toLocaleDateString()) before you send it to your api/server.

Keep in mind that .toLocaleDateString() also allows you to pass the locales, and or any options like a timezone, or a format which you might want to specify. See the documentation here for more examples.