Date/Time Formatting in React

Question

I am working with an API that returns Dates in the format 2022-03-01T11:32:37

Created:&nbsp;{this.props.proposal.OPENWHEN}

Created: 2022-03-01T11:32:37

How do i format this into DD/MM/YYY 24:00:00 ?

Thanks In Advance

Does this answer your question? [How do I format a date in JavaScript?](https://stackoverflow.com/questions/3552461/how-do-i-format-a-date-in-javascript) — David, Nov 18 '22 at 16:08
Please read [ask]. You are supposed to search for the answer yourself before posting here. This question has been answered countless times already and information about how to handle dates in javascript is not more then a google search away. — super, Nov 18 '22 at 16:10

score 0 · Answer 1 · answered Nov 18 '22 at 16:18

Something like the following should be enough:

// Example expected argument: 2022-03-01T11:32:37 
function prettifyDateTime (str) {
    // Splitting the string between date and time
    const [date, time] = str.split("T");

    // Assuming 03 is the month and 01 is the day – otherwise, those could be swapped
    const [year, month, day] = date.split("-")

    // Added slashes and the space before the time
    return `${day}/${month}/${year} ${time}`
}

prettifyDateTime("2022-03-01T11:32:37") // '01/03/2022 11:32:37'

Otherwise, I recommend using a date library like date-fns, dayJS, or moment.

score 0 · Answer 2 · answered Nov 18 '22 at 16:26

You can use the Date object to accomplish what you want. It'll also accept other date formats. Here is one place to find Date description. You also get the benefit of rejecting invalid date formats

function prettifyDateTime(str) {
  let date = new Date(str);
  // There's other ways of formatting this return
  return date.toLocaleDateString() + ' ' + date.toLocaleTimeString();
}

Date/Time Formatting in React

2 Answers2