reformat date coming form array javascript/React

Question

i am trying to figure out how to reformat a date coming from an array... Example:

data: [{id: "1213" startDate: "2020-04-22T17:20:35.797Z" endDate: "2021-04-22T17:20:35.797Z"}]

<div>{data.startDate}</div>

currently the date is displaying as 2020-04-22T17:20:35.797Z. My question is how do i reformat the date to show as 04/22/2020?

Answer 1

First convert your date to a js date:

const date = new Date(data.startDate);

Then use the toLocaleDateString function to convert to local date string:

<div>{date.toLocaleDateString()}</div>

To batch convert your data array, you can do that:

const newData = data.map(item => {
    const startDate = new Date(item.startDate);
    const endDate = new Date(item.endDate);
    return {id: item.id, startDate: startDate.toLocaleDateString(), endDate: endDate.toLocaleDateString()}
})

Answer 2

Try the following code. Convert startDate to a javascript Date object and then use normal formatting to get the desired output. Ouput will be array of formatted dates

 let arr = [{ id: "1213", startDate: "2020-04-22T17:20:35.797Z", endDate: "2021-04-22T17:20:35.797Z" }]; const ret = arr.map(item => { let startDate = new Date(item.startDate); let datestring = startDate.getDate() + "-" + (startDate.getMonth() + 1) + "-" + startDate.getFullYear(); return datestring; }); console.log(ret);