使用 date-fns 将 HH:mm 转换为 JavaScript 中的 UTC 日期时间

Question

我正在开发一个预约 React 应用程序，教师可以在其中以时间段的形式设置他们的虚拟办公时间。

let availability = ["09:00", "17:00"]; // from 9 AM to 5 PM local time

因为这个时间对老师来说是本地时间，所以我想把它存储为 ISO 8601 格式的 UTC 时间，这样如果学生在不同的地区，我可以在客户端解析它并显示这个适当时区的时间。

我试过像这样使用 date-fns@2.22.1 中的 parse 函数

parse('09:00', 'HH:mm', new Date()); // => Wed Jan 01 0020 00:00:00 GMT-0456 (Eastern Daylight Time)

但是，这不是 return 我所在时区的时间（中部标准时间）。

有没有办法用 UTC 表示这个本地时隙？

Answer 1

不确定这是否是您想要的输出

const inputTime = "09:00";

const outputDate = new Date(new Date().toJSON().slice(0, 10) + " " + inputTime).toUTCString();

console.log(outputDate);

Answer 2

我找到了一个受@Anas Abdullah Al 启发的解决方案。这里有两个简单的函数，可以从 UTC 时间和用户本地时间进行转换。

const format = window.dateFns.format;

const convertLocalToUTC = (localTime) => {
  if (!localTime) {
    throw new Error("Time can't be empty");
  }
  return new Date(`${new Date().toJSON().slice(0, 10)} ${localTime}`)
    .toISOString()
    .slice(11, 16);
};

const convertUTCToLocal = (UTCTime) => {
  if (!UTCTime) {
    throw new Error("Time can't be empty");
  }
  const currentUTCDate = new Date().toISOString().substring(0, 10);
  const inputUTCDateTime = `${currentUTCDate}T${UTCTime}:00.000Z`;
  return format(new Date(inputUTCDateTime), "HH:mm");
};

const UTCTime = "14:00";
const localTime = "09:00";

console.log(convertLocalToUTC(localTime)); // 14:00 UTC
console.log(convertUTCToLocal(UTCTime)); // 09:00 CST

<script src="https://cdnjs.cloudflare.com/ajax/libs/date-fns/2.0.0-alpha0/date_fns.min.js"></script>

希望这对其他人有帮助。

使用 date-fns 将 HH:mm 转换为 JavaScript 中的 UTC 日期时间

Convert HH:mm to UTC date time in JavaScript using date-fns

javascript

datetime

date-fns