Vue 移动端webApp填坑

1.IOS滚动不平滑的问题

• 在移动端特别是iOS中，当滚动屏幕时会发现手指一拿开滚动就停止，这种用户体验效果很不好，有种给用户滚动卡顿的感觉。CSS3中的-webkit-overflow-scrolling属性可以完美的解决这个问题，该属性可控制元素在移动设备上是否使用滚动回弹效果

auto：使用普通滚动, 当手指从触摸屏上移开，滚动会立即停止。

-webkit-overflow-scrolling:auto

touch：使用具有回弹效果的滚动, 当手指从触摸屏上移开，内容会继续保持一段时间的滚动效果。继续滚动的速度和持续的时间和滚动手势的强烈程度成正比。同时也会创建一个新的堆栈上下文。

-webkit-overflow-scrolling:touch

2.安卓输入框被键盘挡住问题

部分安卓机中输入框被被键盘遮挡住，以下这种解决办法，可以解决绝大数安卓机上面的问题

if(/Android/.test(navigator.appVersion)) {
   window.addEventListener("resize", function() {
     if(document.activeElement.tagName=="INPUT" || document.activeElement.tagName=="TEXTAREA") {
       document.activeElement.scrollIntoView();
     }
  })
}

3.移动端click点击清除300ms延迟

import FastClick from 'fastclick' 

window.addEventListener('load', () => {
    FastClick.attach(document.body)
})

另:一个不错的progress组件

• 在线演示文档 跑马灯、进度条、step等级进度等
• 地址