yyyy-MM-dd HH:mm:ss is Invalid Date in Safari, IE等浏览器下

一、踩坑背景

在做某个项目的过程中，系统要求兼容safari，在使用Element-ui情况下，用到了datepicker组件，但是datepicker在type为daterange情况下，页面首次加载给日期组件赋初值，但是变量是有值，视图没有展示出来。

于是在解决这个问题的过程中，我在github上找到了初步的解决办法：https://github.com/kenberkeley/fix-date。

引入fix-date这个模块，可能还是有点问题。

二、问题的根源

因为自己开发环境不是Mac，所以没有safari浏览器。之前一直以为是Element-ui日期组件本身的问题，其实并不是。问题出在safari浏览器上，对于new Date()，这个方法所接受的参数，不能是'2019-02-27 23:59:59'格式，还有些不兼容的格式，大家可以有空自己在safari浏览器下试验下。所以在使用new Date('2019-2-27 23:59:59')导致本身解析出来的是NaN-NaN-NaN NaN:NaN:NaN，所以Element-ui日期组件上才不会显值。改了之后，发现日期组件还是没有显示出来。结果是因为传给日期组件的日期格式也有一定的问题。不能传递'2019-2-27 23:59:59',可以参考value4: [new Date(2000, 10, 10, 10, 10), new Date(2000, 10, 11, 10, 10)],element-ui官网的赋值方式来赋值。这时候就没什么问题。

三、解决办法。

1.fix-date（一个npm模块，可以去npm.js上下载）

https://github.com/kenberkeley/fix-date/blob/master/README.md

按照这个地址上面的方法使用，便可以解决。（有可能针对某些版本的safari浏览器可能无效）

2.对问题的根源做解决

对于new Date('2019-02-27 23:59:59')这种格式，safari不兼容，所以要将xxxx-xx-xx的时间格式，转换为 xxxx/xx/xx的格式 。

'2019-02-27 23:59:59'.replace(/-/g,'/'))

对于初始化日期组件，没有显示的问题,解决参考element-ui官网的方式：

value4: [new Date(2000, 10, 10, 10, 10), new Date(2000, 10, 11, 10, 10)]