如何使用date-fns提取datetime中的hh:mm格式时间？

嘿，我之前也碰到过一模一样的需求，date-fns确实没有直接开箱即用的“只提取时间”函数，但组合它的解析和格式化工具就能完美解决，还特别灵活！

核心思路 #

其实就两步走：

• 先把输入的带时区ISO字符串解析成可操作的Date对象
• 再用格式化函数精准提取出hh:mm格式的时间部分

代码实现（24小时制） #

如果你的需求是24小时制的时间（比如07:30、14:45这种），直接用这段代码就行：

import { parseISO, format } from 'date-fns';

const getTimeFromISO = (isoDatetime) => {
  // 解析带时区的ISO字符串，date-fns会自动处理时区偏移
  const parsedDate = parseISO(isoDatetime);
  // 格式化输出24小时制的时:分
  return format(parsedDate, 'HH:mm');
};

// 测试你的示例输入
console.log(getTimeFromISO('2020-06-29T07:30:00+02:00')); // 输出 "07:30"

如果你需要UTC时间 #

要是你想输出的是UTC时区的时间（而非本地时间），只需要把format换成formatUTC就搞定了：

import { parseISO, formatUTC } from 'date-fns';

const getUTCTimeFromISO = (isoDatetime) => {
  const parsedDate = parseISO(isoDatetime);
  return formatUTC(parsedDate, 'HH:mm');
};

// 测试示例：输入的+02:00时区时间，对应的UTC时间是05:30
console.log(getUTCTimeFromISO('2020-06-29T07:30:00+02:00')); // 输出 "05:30"

小提示：格式符的区别 #

• HH：代表24小时制的小时（00-23），适合不需要区分上午下午的场景
• hh：代表12小时制的小时（01-12），如果需要这种格式可以直接替换，比如format(parsedDate, 'hh:mm')，不过通常配合a（上午/下午标识）使用会更清晰

这种方法的好处是完全基于date-fns的标准API，不用担心手动切割字符串带来的时区解析错误——哪怕输入的时区偏移变化，date-fns都会自动处理转换。

内容的提问来源于stack exchange，提问作者aron fischer