您的位置:首页 > 移动开发 > 微信开发

解决微信上下滑动出现黑底背景问题

2018-03-26 11:23 363 查看
1.html
 <keep-alive>
        <router-view class="router-view" v-if="$route.meta.keepAlive"></router-view>
    </keep-alive>

2.js部分
function scrollFix (scrollEl, targetSelector) {
  const offset = 5
  let startY = 0
  scrollEl.addEventListener('touchstart', e => { startY = e.touches[0].pageY })
  scrollEl.addEventListener('touchmove', e => {
    const y = startY - e.touches[0].pageY
    const pullDownAction = y < -offset
    const pullUpAction = y > offset
    const viewHeight = document.documentElement.clientHeight
    const targetEl = scrollEl.querySelector(targetSelector)
    if (!targetEl) return
    if ((pullDownAction && targetEl.scrollTop <= 0) || (pullUpAction && Math.floor(targetEl.scrollHeight - viewHeight) <= targetEl.scrollTop)) {
      e.preventDefault()
    }
  })
}
 scrollFix(this.$el, '.router-view')  //this.$el指 是当前组件的的元素  代码写在app.vue中
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: 
相关文章推荐