Moment - problem with Timezone

Asked

Viewed 119 times

3

I receive the service date as follows:

2020-11-05T06:15:00.000-03:00

To display to the user we use the library Moment.

Example:

import React from 'react';
import moment from 'moment';

var chegada = '2020-11-05T06:15:00.000-03:00';
console.log('--> data: ' + chegada);
console.log('--> data (moment):' + moment(chegada).format('DD/MM/YYYY HH:mm'));

My problem is that it takes into consideration the Timezone smartphone.

Changing the Timezone to -04:00 I have the following result:

Exit

 LOG  --> data: 2020-11-05T06:15:00.000-03:00
 LOG  --> data (moment):05/11/2020 05:15

How do I take into account the Timezone informed on the date, and not the smartphone?

  • @hkotsubo is a good answer, but I think he wants to know how to do it using the momentjs and not pure Javascript.

  • Thiago test my answer see if in React-Native is equal to the last date please?

  • @Cmtecardeal If you read the answer you have in the duplicate I suggested, you will see that there also has a solution option with Moment.js, and that - from what I understand - serves for the case in question (moment.parseZone)

  • @hkotsubo really has ... we just need to know if the device will work but, ta certinho.

  • @hkotsubo, yes! responds perfectly!

  • 1

    In fact @novic also gave a simple solution and with the same result as the suggested question! Thank You All!

Show 1 more comment

1 answer

4


In the documentation you have to call the method parseZone(false) for :


const chegada = '2020-11-03T06:15:00.000-03:00';
const formatada = moment
  .parseZone(chegada)
  .format('DD/MM/YYYY HH:mm');

document.getElementById('chegada').innerHTML = chegada;
document.getElementById('formatada').innerHTML = formatada;
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.1/moment-with-locales.min.js" integrity="sha512-LGXaggshOkD/at6PFNcp2V2unf9LzFq6LE+sChH7ceMTDP0g2kn6Vxwgg7wkPP7AAtX+lmPqPdxB47A0Nz0cMQ==" crossorigin="anonymous"></script>

<div>
  <div id="chegada"></div>
  <div id="formatada"></div>
</div>

Another way also that works:

moment('2020-11-05T06:15:00.000-03:00')
        .utcOffset(-3)
        .format('DD/MM/YYYY HH:mm')

Reference of the website: How to show the Date object with the Timezone it was created in Javascript?

  • In this case, he would have to extract Timezone from the string to pass as argument on utcOffset? Because I am aware that Timezone will be dynamic and according to the date of service.

  • So @Cmtecardeal don’t know? I read in the documentation and create the answer, it would really be an inefficient code if you have this dynamic factor ! He asked me about the Timezone that is depreciated and has to use utcOffset...

  • 1

    @Cmtecardeal I put another method and I’ll let him test!

  • 1

    @novic, perfect! worked !!! Another way I discovered would be : Moment.parseZone(arrival). format('DD/MM/YYYY HH:mm')

  • @Thiagoluizdomacoski Just for the record, use local may not give the desired result in all cases, as it varies according to the Timezone configured in the environment in which the code runs (be it the browser, Node, etc). See here an example that gives difference (and see that with parseZone doesn’t make that difference)

  • In case it is on the device and this I tested and it works @hkotsubo is React-activate the case in specific.

  • @novic Good, as I do not know very well React-Native, I will believe in vc :-) I just wanted to alert to the more general case (browsers, etc), since dealing with timezones always has these "traps", in Javascript then not even speak...

  • Well I tested at expo @hkotsubo but, to remedy this doubt I will put only parseZone then ...

  • I think you can let the local also, only adding the caveat maybe (if it applies to the Act, otherwise leaves it so)

  • I’ll leave the pattern of your reply I think better @hkotsubo ...

Show 5 more comments

Browser other questions tagged

You are not signed in. Login or sign up in order to post.