标签:移动端 不兼容 string 是的 格式 表达式 理解 模拟 对象
1、关于手机QQ浏览器和微信内置浏览器(默认理解微信内置浏览器就是qq浏览器)
(1)不兼容es6语法
项目前台用的是vue,后台java,移动端。前期开发主要是在电脑上模拟手机看效果,一直也没啥问题,后来完成的差不多了就在手机看看效果,看看兼容性吧,结果,果然存在问题,
在手Q和微信进入页面之后没有内容,在其他浏览器显示正常,然后开始查资料,问前辈,才知道,vue中特别是钩子函数那块,自己大部分用的es6语法,而es6语法显然目前并没有被所有
浏览器兼容,而不幸的是手Q目前是没有兼容的,所以赶紧改语法,换成比较保险的语法格式,ok,页面完美显示。
(2)后台返回的数据格式,有时是object有时是string
用vue做项目,取值,显示值非常方便,返回的基本上就是对象,然后就直接取值,做展示就好了,可是这次遇到的问题就更奇葩,在本地测试,所有浏览器都是ok的,然后上服务器,
在正式环境中做测试,又不幸的手Q和微信又有问题了,这两个根本不能登录,有时不停的操作,可能会登上去,但是这显然是不行的,所以又开始了不停找bug之旅,不停的测试,定位,终于发现,
在最初后台返回数据的时候,在正常浏览器和手Q浏览器得到的数据格式是不一样的,在正常浏览器得到的object,所以我可以直接通过“ . ”取数据,可是手Q浏览器得到的是string,那我肯定就不能在直接
“ . ”来得到数据了,所以根本登录不了。所以没办法,我只好在每一个返回数据的接口处,都先判断该数据是什么类型,如果是string则JSON.parse()方法,把string转化为object,这样就可以正常读取数据了。
但是到现在,我还是没有想明白,为什么会有这样的情况,绝对是浏览器得问题吗,显然不是的,因为我在本地的时候,用任何浏览器都是可以的,为啥到了服务器之后,手Q的数据格式就变成string了呢?
真的不明白,但是我会继续研究的,后期如果知道再做更新。
2 、神奇的split()函数
在项目中,客户需要有一个日历,通过选择任意一天,在页面上显示当周的周一和周日的日期,日历就找的插件做的,一般的插件就是点击一下得到当前选择的日期,我稍微对选择的日期做下处理,
在日历页面弹窗,点击确定的时候,有一个回调函数,在回调函数里,通过得到的当前日期,通过一系列处理(toLocaleDateString()),得到当周的周一和周日,但是此时我得到的日期格式为2017/7/1,而我们接口中用的格式为
2017-07-01,所以必须对日期格式进行转化,因为本人对正则表达式是只会用不会写,所以就开始找相关的正则,可是很不幸,没有找到,那没办法,就只能用笨办法了,手动的进行分割,再判断是否添加0吧,
问题就在这个时候发生了,因为我在电脑上看到的,得到的日期格式为2017/7/1,所以就直接按照“/”来处理,结果后来发现,手机和pc只能兼容一个,我又觉得不对劲了,难道split方法还存在兼容性,然后就在直接弹窗看数据到底什么样的,
果然,在pc和移动上得到的日期格式是不一样的,一种的2017/7/1,一种的2017-7-1,具体哪个是哪个我现在也忘了,但是不管那种格式,都是不能用的,我要的是2017-07-01,所以此时,我又通过神奇的网站,找的一个正则表达式
re =/^(20[01]\d|1\d{3}|[1-9]\d\d?|\d)\/([1-9]|1[0-2])\/(3[01]|[1-2]\d|\d)$/;
判断是否为 2017/7/1格式,如果2017/7/1格式,则split(‘/‘),else split(‘-‘),好了也算经历了千辛万苦总算解决了
3、onfocus事件的触发
还是在日历插件上,在好不容易完后 2 之后,我又发现一个悲伤的事情,这个日历在ios上触发一点点都不灵敏,我点10次,能弹出一次,已经算是很给面子了,这可怎么整,然后又开始查资料,查了半天没找到有用的信息,
我很好奇,难道这种奇葩的问题,真的只有我一个人遇到吗,突然灵光一现,反正都是要触发input,从而触发日历插件,那么ciick不也可以吗,果断更换,结果,真的可以呀,虽然都说click在移动端的会有300ms的延时,但是我总体测试,
点下来也没觉得啥,反正目前我还没找到比较好的解决方案,此路不通,再换一条咯。
好了,这就是我最近遇到的比较奇葩的问题,以后如果再有,会继续写4、5、6的,这些bug在经历的时候,真的觉得很奇葩,但解决之后还是很有成就感的!嘻嘻
标签:移动端 不兼容 string 是的 格式 表达式 理解 模拟 对象
原文地址:http://www.cnblogs.com/xumqfaith/p/7102752.html