美文网首页
【React】阻止底部页面滚动

【React】阻止底部页面滚动

作者: 嗖嗖编程 | 来源:发表于2020-06-09 11:39 被阅读0次

    一.弹窗出现时

    document.body.addEventListener("touchmove", this.scroll, {passive: false });
    document.body.style.overflow = 'hidden';
    

    ps:在移动端有时布局会出现滑动表层div时无响应,body跟随滑动,基本会出现在滚动区域处于顶端或者低端进行反向滑动时。也可以那个通过在componentDidMount回调中关闭body的滑动。

    二.弹窗消失后

    document.body.removeEventListener('touchmove', this.scroll);
    
     //添加事件监听时添加了passive参数,在ios9中移除事件监听也需要加此参数
    document.body.removeEventListener('touchmove', this.scroll,{passive: true});
    document.body.style.overflow = 'auto';
    

    相关文章

      网友评论

          本文标题:【React】阻止底部页面滚动

          本文链接:https://www.haomeiwen.com/subject/vuubzhtx.html