SQL获取时间不正确，React前端格式化后日期时分显示异常

根因分析 #

问题主要来自两个可复现的错误点：

• 时区解析不一致：服务端返回的无时区标识的日期字符串，在前端解析时会默认采用客户端本地时区处理，若服务端返回时间的时区与客户端时区不匹配，就会出现固定时长的偏移，20点转为3点符合跨时区解析的差值特征。
• 格式化符号使用错误：当前代码中使用的hh为12小时制格式符，若需要输出24小时制时间，需替换为HH，否则下午时段的时间会出现显示错误。

修复步骤 #

1. 优先校验日期解析结果
   先确认日期解析环节是否出错，修改代码打印解析后的Date对象，同时修改小时格式符：

const FormatDate = (date) => {
    try {
        const parsedDate = new Date(date);
        // 此处可打印确认解析后的时间是否与预期一致
        console.log(parsedDate);
        // 替换hh为HH，使用24小时制格式化
        return format(parsedDate, "yyyy/MM/dd HH:mm:ss");
    } catch (e) {
        return "";
    }
};

2. 修复时区偏移问题
   如果打印确认解析出的Date对象本身时间就和服务端返回不一致，说明是时区解析问题，可选择以下任意一种方案修复：

• 服务端返回日期时统一输出带时区标识的ISO标准字符串，例如2021-02-02T20:12:36+08:00，前端可自动识别时区完成正确解析
• 若无法调整服务端返回格式，前端解析时手动指定对应时区，可使用日期库的时区解析方法绑定服务端时间对应的时区后再进行格式化

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