苹果手机通过new date(dateString)新建时间对象失败问题

Posted 2021-06-30 GHUIJS

最近项目涉及到前端页面倒计时问题，就是通过服务端给的字符串new时间对象，减去当前时间得到时间戳实现倒计时效果。安卓设备没问题，苹果设备就显示这样：

mdn在new date(dateString)给出提示：

注意: 由于浏览器之间的差异与不一致性，强烈不推荐使用Date构造函数来解析日期字符串 (或使用与其等价的Date.parse)。对 RFC 2822 格式的日期仅有约定俗称的支持。 对 ISO 8601 格式的支持中，仅有日期的串 (例如 "1970-01-01") 会被处理为 UTC 而不是本地时间，与其他格式的串的处理不同。

 就是说new date(dateString)传入'2021-6-25'可能会报错。

果然，今天我便遇到了，倒计时在安卓手机没问题，在苹果手机则不能new 时间对象。

解决办法是把时间字符串拆分，通过

new Date(year, monthIndex [, day [, hours [, minutes [, seconds [, milliseconds]]]]]);

创建时间对象，代码如下：

export function createDate(date) {
    var ps = date.split(" ");
    var pd = ps[0].split("-");
    var pt = ps.length > 1 ? ps[1].split(":") : [0, 0, 0];
    return new Date(pd[0], pd[1] - 1, pd[2], pt[0], pt[1], pt[2]);
}

eg:

<view>{{new Date($newDate.createDate('2021-06-25 10:45:20'))}}</view>