如何用DayJS将ISO日期时间字符串转换为本地时区并格式化？

我调用API获取到ISO格式的时间戳字符串2023-02-18T14:54:28.555Z，需要将其格式化为用户本地时区时间。尝试用DayJS直接解析格式化：

dayjs("2023-02-18T14:54:28.555Z").format('YYYY-MM-DD HH:MM:ss A') // => "2023-02-18 20:02:28 PM"

在+0530 IST时区下，这个结果比正确时间慢了30分钟，而用JavaScript原生Date构造函数解析同一字符串能得到正确结果：

new Date("2023-02-18T14:54:28.555Z").toString() // => 'Sat Feb 18 2023 20:24:28 GMT+0530 (India Standard Time)'

解决方案 #

问题根源有两点：一是DayJS核心包默认的时区处理能力有限，二是格式字符串的写法错误。按以下步骤修正即可：

1. 安装/引入必要插件
   DayJS需要借助utc和local插件来准确处理时区转换，先确保依赖就绪：

• npm安装：

npm install dayjs @dayjs/plugin-utc

• CDN引入：

<script src="https://unpkg.com/dayjs@1.11.7/dayjs.min.js"></script>
<script src="https://unpkg.com/dayjs@1.11.7/plugin/utc.js"></script>

2. 正确编写代码逻辑
   启用插件后，先将ISO字符串解析为UTC时间，再转换为本地时区，同时修正格式字符串的错误（分钟用小写mm，大写MM代表月份）：

// 启用插件
dayjs.extend(window.dayjs_plugin_utc)

// 解析UTC时间并转换为本地时区
const utcTime = dayjs.utc("2023-02-18T14:54:28.555Z")
const localTime = utcTime.local()
const formattedTime = localTime.format('YYYY-MM-DD HH:mm:ss A')

console.log(formattedTime) // 在+0530时区下输出："2023-02-18 20:24:28 PM"

关键说明 #

• 格式字符串中，分钟必须用小写mm，大写MM是月份的占位符，这是你之前时间显示错误的直接原因之一。
• 带Z后缀的ISO字符串代表UTC时间，通过dayjs.utc()明确解析为UTC时间后，再调用.local()转换到用户本地时区，能避免非整小时偏移时区的计算偏差。

内容的提问来源于stack exchange，提问作者Lanil Marasinghe