10

我有一个要求,我需要在当地时区显示用户的时间。这需要使用 date-fns 来完成。

以下代码检查当前时间,然后给定一个时区,根据时区将其转换为本地时间。

const { formatToTimeZone } = require('date-fns-timezone')

let date = new Date()
const format = 'D.M.YYYY HH:mm:ss [GMT]Z (z)'
const output = formatToTimeZone(date, format, { timeZone: 'Asia/Calcutta' })

但是,我如何即时猜测用户的时区?

moment.js,你可以得到它moment.tz.guess()moment.js但是没有和使用我怎么能做到呢date-fns

https://runkit.com/embed/835tsn9a87so

更新:我将在 VueJS 应用程序中使用它。因此,如果有任何其他相关的解决方案,也欢迎。谢谢。

4

2 回答 2

27

为了获取用户的 IANA 时区标识符,大多数现代浏览器现在支持以下内容:

Intl.DateTimeFormat().resolvedOptions().timeZone

也就是说,您需要使用formatToTimeZonefrom的通常原因date-fns-timezone是当您需要使用不同于用户本地区域的时区时。否则,您通常可以只format使用date-fns.

但是,在您的情况下,您还尝试使用z格式说明符来显示用户的时区缩写。这不是由 date-fns 直接提供的,因此如果这很关键,那么您确实需要使用上面显示的 Intl api 获取用户的时区并使用formatToTimeZone.

请记住,尽管这些缩写是 IANA 数据记录的任何内容,仅使用英文,并且没有每个时区的缩写。对于那些不这样做的人,您将看到一个数值,例如-02.

此外,许多缩写词可能含糊不清(例如IinIST可能意味着印度、以色列或爱尔兰,以及许多其他...)。因此,在大多数情况下,如果您不需要缩写,通常最好不用它。

于 2019-02-06T19:34:18.337 回答
2

刚刚自己解决了一个类似的问题。诀窍是使用format函数 fromdate-fns-tz而不是 from date-fns

import { format } from "date-fns";
console.log(format(new Date(), "yyyy-MM-dd HH:mm z"));
// 2021-11-29 13:55 GMT-8

import { format } from "date-fns-tz";
console.log(format(new Date(), "yyyy-MM-dd HH:mm z"));
// 2021-11-29 13:55 PST

请参阅此处的文档: https ://date-fns.org/v2.27.0/docs/Time-Zones

于 2021-12-09T20:59:16.407 回答