使用 date-fns 进行时区转换

我正在尝试在基于 React 的网页中使用 date-fns-tz，但无法使以下用例正常工作。

我在表单中输入了一个日期，该表单应提交到以本地时区存储数据的后端。

用户在GMT+2时区选择2021年2月1日 14:00在 UI 中，这与1612180800时间戳（因为 UI 在 GMT+2 中打开），但最终应该作为 14:00 发送到后端GMT-8，这实际上是1612216800时间戳。

使此转换（从 1612180800 --> 1612216800 ）发挥作用的正确方法是什么？

我尝试使用各种 date-fns 函数，但没有找到合适的函数。

您需要做两件事才能使其正常工作：

• 预期目标时区的 IANA 时区标识符，例如'America/Los_Angeles'，而不仅仅是相对于 UTC 的偏移量。

  • 请参阅“时区！=偏移量”时区标签 wiki https://stackoverflow.com/tags/timezone/info.

• 支持在特定时区提供输入的库。

  • 既然您询问了 date-fns，您应该考虑使用日期-fns-tz https://github.com/marnusw/date-fns-tz附加库。
  • 或者你可以使用Luxon https://moment.github.io/luxon/index.html为了这。
  • 过去我可能会推荐 Moment 和 Moment-TimeZone，但你应该回顾一下Moment的项目状态页面 https://momentjs.com/docs/#/-project-status/在选择此选项之前。

坚持使用 date-fns 和 date-fns-tz，您给出的用例正是文档中描述的用例zonedTimeToUtc https://github.com/marnusw/date-fns-tz#zonedtimetoutc函数，我将在这里复制：

假设用户被要求输入事件的日期/时间和时区。日期/时间选择器通常会返回具有所选日期（位于用户本地时区）的 Date 实例，并且选择输入可能会提供实际的 IANA 时区名称。

为了有效地使用此信息，有必要找到等效的 UTC 时间：

import { zonedTimeToUtc } from 'date-fns-tz'

const date = getDatePickerValue() // e.g. 2014-06-25 10:00:00 (picked in any time zone)
const timeZone = getTimeZoneValue() // e.g. America/Los_Angeles

const utcDate = zonedTimeToUtc(date, timeZone) // In June 10am in Los Angeles is 5pm UTC

postToServer(utcDate.toISOString(), timeZone) // post 2014-06-25T17:00:00.000Z, America/Los_Angeles

在你的情况下，唯一的变化是在最后而不是调用utcDate.toISOString()你会打电话给utcDate.getTime().

请注意，如果您打算传递以秒为单位的时间戳而不是由 提供的毫秒精度，您仍然需要除以 1000Date object.