打字稿日期时区设置

编程问答 2022-06-05

问题描述

我有一个React应用程序，该应用程序获取包含时间戳的ISO8601格式的列表数据。日期将来自美国/芝加哥时间ex。 “ 2020-09-01T06：05：00-05：00” ...我相信是美国/芝加哥，因为-05：00代表中央夏令时。我想让用户选择他们想要查看日期的时区（美国/芝加哥，美国/丹佛，...等）。我想使用date-fns和date-fns-tz软件包。

让我烦恼的是，当我在控制台上打印日期时，我会看到相对于本地时区的日期。由于我将用户设置在不同的时区，因此我不希望它成为默认功能，因此当我打印日期并在DOM中使用它们时，他们应该参考他们选择的时区。

type TZ = 'US/Chicago' | 'US/Denver';
const [timezone,setTimezone] = React.useState<TZ>('US/Chicago');

const onUpload = (data: string[]) => {
     
     // convert data ( list of iso8601 dates ) to tz
     const dates = data.map(d => parseISO(d));
     // something with date-fns-tz
    
     setDates(dates)
}

解决方法

这可能会达到目的：

const clientsTimeZone = Intl.DateTimeFormat().resolvedOptions().timeZone
const [timezone,setTimezone] = React.useState(clientsTimeZone);

或者如果存在SSR问题，则可以将其设置为useEffect

date-fnsreactjsreactjsreactjsreactjstypescripttypescripttypescript