vue 时区转换_在 React & Vue 中 将矫正时间（UTC）转为本地时间的奇淫技巧！！！...

看过看多前端开发者，转个时间还需要下载专业的包，其实，例如 ThinkSNS Plus 项目，后端时间固定为 UTC 的，有一个小技巧，转换本地时间爽歪歪！！！

还有那很多公共 API 基本都是 UTC 时间，包括 GitHub。

Vue 版

{{ date }}

export default {

props: {

utc: {

type: String, required: true

}

},

computed: {

date() {

return (new Date(`${this.utc}Z`)).toLocaleString();

}

}

};

React 版本

import React from 'react';

export default ({ utc }) => ( {(new Date(`${utc}Z`).toLocaleString())} )

浏览器测试版

let timeStr = '2017-9-1 00:00:00';

console.log(

(new Date(timeStr + 'Z')).toLocaleString()

);

将上面代码复制到浏览器的 Console 粘贴 会车执行。

原理

例如使用 Laravel 拿到的时间是 2017-9-13 16:20:35 我们只要在最后加入 Z 字符串，就表示为「矫正时间」然后 Date 函数会自动处理时区问题的。

可以强化一下，结尾是 z 则不添加字符串。

当然，前提条件是你的程序类似 ThinkSNS Plus 一样统一使用 UTC。

Seven 的代码太渣，欢迎关注我的新拓展包 medz/cors 解决 PHP 项目程序设置跨域需求。