react vant 2.0 Overlay组件 滑动到底部不能滚动的问题

在 Vant 2.0 中,Overlay 控件中添加 prevent-default-scroll 属性的方式与 Vant 1.x 稍有不同。具体做法如下:

import { Overlay } from 'vant';
function MyComponent() {
  const [show, setShow] = useState(false);
  return (
    <Overlay 
      show={show} 
      onClick={() => setShow(false)}
      lockScroll={false} // 禁止滚动穿透
      prevent-scroll-default={true} // 禁止默认滚动事件
    >
      // Overlay 内容
    </Overlay>
  );
}

其中,prevent-scroll-default 属性用于禁止默认的滚动事件,lockScroll 属性用于禁止滚动穿透(即禁止在 Overlay 显示时滚动底层页面),两者结合起来可以解决 Overlay 滑动到底部不能滚动的问题。

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容