Maison  >  Article  >  interface Web  >  Un problème de fuseau horaire à la date de réaction-native-paper-date (y-off)

Un problème de fuseau horaire à la date de réaction-native-paper-date (y-off)

WBOY
WBOYoriginal
2024-07-18 08:15:15962parcourir

A timezone problem on react-native-paper-date (y-off)

Le problème d'aujourd'hui est que j'ai un problème avec l'utilisation des dates papier réactives et que les jours de la semaine qui apparaissent sur le calendrier modal n'étaient pas corrects. Il était décalé d'un jour, par exemple, nous sommes aujourd'hui le 15 juillet 2024 et le 15 était censé apparaître dans la colonne du lundi, mais il figurait plutôt dans la colonne du dimanche.

Finalement, j'ai compris que le problème avait quelque chose à voir avec Intl.DateTimeFormat parce que j'ai essayé d'exécuter le code ci-dessous sur 2 environnements ; le mien et un runtime Javascript sur Mozilla.dev (je sais que c'est tellement bête mais j'ai essayé mdr).

console.log(Intl.DateTimeFormat().resolvedOptions().timeZone);
//"UTC" on my local development env
//"Asia/Phnom_Penh" on Mozilla.dev

Maintenant, j'ai compris, alors je me plains à mon collègue et il a mentionné que Javascript's Intl n'est pas stable pour notre application. Il m'a donc envoyé ce lien formatjs ici qui mentionnait que le moteur Javascript n'expose pas le fuseau horaire par défaut, il n'y a donc aucun moyen d'obtenir le fuseau horaire par défaut ; et notre application native React utilise Hermes Engine, dont je suppose qu'il n'expose rien sur le fuseau horaire à l'Intl de Javascript, c'est pourquoi il est toujours par défaut « UTC » lorsque j'essaie d'exécuter console.log(Intl .DateTimeFormat().resolvedOptions().timeZone) .

Maintenant que j'ai eu ma réponse ; J'essaie simplement le code ci-dessous et le problème est résolu. En ayant un fuseau horaire approprié, les jours de la semaine sont désormais corrects dans chaque colonne du calendrier modal.

import '@formatjs/intl-datetimeformat/polyfill'
import '@formatjs/intl-datetimeformat/add-all-tz.js'

//If this statement doesn't work, use expo-localization's getCalendar()
const timezone = Intl.DateTimeFormat().resolvedOptions().timeZone

//For my case, I have to use expo-localization
const timezone = Localization.getCalendars()[0].timezone

if ('__setDefaultTimeZone' in Intl.DateTimeFormat) {
  Intl.DateTimeFormat.__setDefaultTimeZone('America/Los_Angeles')
}

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn