Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to format date with date-fns?

I've been trying to format a date using date-fns but I keep failing. Basically I have it working just fine with momentJS but not with date-fns:

Here's my date:

"10-13-20" // month, day, and year

Now with momentJS it works just fine like this:

let result = moment("10-13-20", 'MM-DD-YY').format()
// result = "2020-10-13T00:00:00-06:00"

So I'm trying to do the same using date-fns but no luck. Can anyone point me in the right direction? Thanks in advance!

let result = format(new Date("10-13-20"), 'MM-DD-YY') // Not working
like image 712
Devmix Avatar asked Oct 14 '20 22:10

Devmix


People also ask

What is date Io date-fns?

Abstraction over common JavaScript date management libraries. The project exposes an abstraction interface over luxon, date-fns v2, dayjs and moment. It allows you to build any UI date or time components, while utilizing the same date management library in use within your user's project.

Is FNS date faster than moment?

Date-fns vs MomentJS Performance As you can see, Date-fns are well ahead in all 3 operations in terms of operations performed per second and size and the simple API is the main reason behind this.


1 Answers

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 doing the same 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
    
like image 145
hoangdv Avatar answered Nov 01 '22 19:11

hoangdv