盘点h5在iOS下的那些坑
太忙咯好久没写博客啦！给大家分享一下关于萌芽在实战h5开发中关于iOS(Safari浏览器)的一些坑！希望帮助那些还没遇到过的萌新～
- 在安卓下实现显示正常但是在iOS下时间格式为 NAN-NAN-NAN
- 关于Safari浏览器下cookie无法存储问题
- 在安卓显示正常但是在ios浏览器中字体超级小问题
1.时间格式错误
这个问题萌芽第一次遇到的时候也是一头雾水，后来才发现原来是我们调用了Date函数的原因，Safari不支持new Date(1998-01-01)所以会出现异常，最终就成了我们的NAN-NAN-NAN，他认识的只有new Date(1998/01/01)这种格式，为了达到想要的时间格式效果萌芽直接字符串截取拼接了一下，虽然效果是达到了但是过于简单粗暴不知道大家有没有更好的方法啦～
//时间格式化(最终呈现效果为：1998年01月01日)
FormatDateTime: (inputTime) => {
let date = inputTime.split('-')
return `${date[0]}年${date[1]}月${date[2].slice(0,2)}日`
},2.cookie无法存储
别人家的浏览器都好好的怎么到了Safari又有问题了？！萌芽只好打开Safari浏览器进行调试了一波惊现自己的数据居然没存储进去！原来是Safari不支持存储中文所以只要存进去了中文他就自己变成空白了，然后格式直接就乱掉自然而然也就无法存储以及报错了，萌芽只好先将要存储的内容URI编码转换一下之后就完全没问题啦～
//先将内容转换为String之后再进行URI编码
encodeURIComponent(JSON.stringify( 此处为内容 ))
//调用的时候再进行解码
JSON.parse(decodeURIComponent( 此处为内容 ))顺便一提 localStorage 的话并不会有中文无法存储的问题的，萌芽亲测哟～
3.样式问题
这个其实没什么好讲的啦属于科普一下小知识，平常我们的浏览器最小字号为12px如果小于12px的话展示效果依旧为12px。但是在Safari中最小字体为1px哦！所以如果因为浏览器最小为12px给字体最小字号的时候放飞自我给个1的话等你打开Safari瞬间就火葬场了！养成良好习惯遵守UI设计稿样式来快乐你我他！
