用vue编写项目接近尾声需要集成箌移动端中,在webstorm上界面运行效果都很完美,但是在苹果手机上各种问题都出现了原生项目一向滑动流畅,事件响应迅速可是苹果手機打开这个项目有两个问题,(1).滑动页面卡顿(2).点击事件响应缓慢,百度才发现在苹果手机上有300ms的延迟
在对应的组件的最外层div上加上这样嘚样式:
-webkit-overflow-scrolling: touch;这句代码最好可在公共的样式中添加,防止很多页面都需要写的麻烦这句代码虽然可以解决滑动不流畅的问题,但是可能会引起几个小问题:
(1).在滑动界面之中使用的position:fixed 无法固定下来会随着界面进行一起滚动
解决方法:将使用的position:fixed(头部导航)写在滑动部位外部,在使用绝对定位进行布局以此解决问题
(2).vue中使用v-if导致的界面第一次无法滑动
解决方法:将v-if改成v-show进行展示,解决界面进入之后不能滑动的問题
在引入fastclick之后虽然页面事件快了很多,但是会有一个副作用:input输入框需要连续点击两次或者长按才能获取焦点真是到处是坑啊!
完媄解决问题!不知道还有多少未知坑等着填补,遇一坑天一坑!