Vue前端使用Moment转换PHP接口返回UTC时间自动加2小时问题求解

• 接口返回的start、end字段为带+00:00标识的UTC标准时间
• Moment.js默认解析带时区标识的时间时，会自动转换为浏览器运行环境的本地时区时间，输出多2小时是因为当前浏览器所处时区为UTC+2，属于Moment的默认时区转换逻辑，不是代码报错。

如果你需要保留原始UTC时间输出，直接使用Moment提供的utc()方法解析时间即可，修改后的代码如下：

axios.get('/api/schedules.json').then(function (response) {
    let dataOri = response.data;
    
    // 按UTC时间解析转换
    dataOri.forEach(element => {
        element.start = moment.utc(element.start, "YYYY-MM-DDTHH:mm:ssZ").format("YYYY-MM-DD HH:mm:ss");
        console.log(element.start); // 输出预期值'2021-09-27 09:22:00'

        element.end = moment.utc(element.end, "YYYY-MM-DDTHH:mm:ssZ").format("YYYY-MM-DD HH:mm:ss");
        console.log(element.end); // 输出预期值'2021-09-27 13:22:00'
    });
    self.filterSchedules = dataOri;
});

如果业务需求是让不同时区的用户看到对应自己当地的日程时间，原来的转换逻辑是正确的，只是你对输出结果的预期有误。如果需要统一显示某个指定时区的时间，可以配合moment-timezone库指定时区完成转换。

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