Try using utcToZonedTime()

To change the displayed date/time returned from format(), you must use either:

• utcToZonedTime: when you want to know what the local date is in another timezone
• zonedTimeToUtc: when you want to know what a date in another timezone is in the local timezone

Working Demo

Copyconst [selected, setSelected] = React.useState(new Date());
const [timeValue, setTimeValue] = React.useState(format(selected, 'HH:mm'));

In the second line, the format(selected, 'HH:mm') will get the value of hours:minutes from the Date.

This is the easiest way.

As you can see, with moment lib, we need 2 steps to get the result: parse string to Date object, then format date object to string.

Your code - format(new Date("10-13-20"), 'MM-DD-YY') is format step, try convert a date object to a string with format template is MM-DD-YY. But your date object is not correct.

The solution is to do the same as with moment lib:

1. Parse date string to date object. Use parse

   const dateString = '10-13-20';
   const date = parse(dateString, 'MM-dd-yy', new Date()) // not MM-DD-YY
   

2. Format date object to result string. Use format

   const result = format(date, "yyyy-MM-dd'T'HH:mm:ss.SSSxxx")
   console.log(result)
   

   Result will be like (the same with moment's result in my timezone):

    2020-10-13T00:00:00.000+09:00
   

I appreciate this was asked a while ago but I got tripped up by this recently. The format function seems to output using the timezone of the runtime device. So for example, if you are in British Summer Time (UTC+1) and pass new Date('2023-06-06T12:00:00.000Z') into format, you'll get out a timestamp that is one hour ahead - 2023-06-06T13:00:00.000Z. I'm sure there's an interesting reason for this but I've not taken the time to look into it.

To force date-fns to stick to UTC and not perform this conversion we need to use a date object from date-fns/utc. Example:

import { UTCDateMini } from '@date-fns/utc';
import { format } from 'date-fns/format';

const veryGoodFunctionName = (date: Date): string => format(new UTCDateMini(date), "HH:mm");

You need to parse it before formatting, and your format string is wrong. Check the parse docs

format(parse('18:54:00', 'HH:mm:ss', new Date), 'hh:mm:ss a')

// > 06:54:00 PM

The format tokens for date-fns can be found here: https://date-fns.org/v2.28.0/docs/format

const sampleText = 'Tue Aug 03 2021 18:49:11 GMT+0800';
const sampleDate = new Date(sampleText);
format(sampleDate, 'HH:mm')