评论

解决弹框滑动时,页面跟随滑动问题(弹框内容过长,有滚动内容时,同样适用)

解决页面跟随弹框滑动问题

1 使用背景

小程序开发过程中,如果使用弹框功能,弹框滚动时,经常会出现小程序页面跟随弹框滚动而滚动,产品经理一般希望能做到弹框滚动时,页面不要滚动。

2 效果演示

解决前效果.gif

解决后效果.gif

3 解决技术点

弹框内容使用scroll-view组件

4 代码片段

https://developers.weixin.qq.com/s/dKcg2Kmh75rd

5 温馨提示:

不定期分享文章,欢迎关注哈。


最后一次编辑于  2021-07-12  
点赞 1
收藏
评论

1 个评论

  • zcq
    zcq
    2021-07-14

    你好,如果弹框里面有一个固定高度的textarea,且textarea输入的文字较多时,正常情况是能滚动的,但是弹框最外层加了catchtouchmove导致textarea无法滚动,请问这应该如何解决?

    2021-07-14
    赞同
    回复 2
    • 李伟豪
      李伟豪
      2021-07-15
      我用scroll-view作为弹框内容时,放textarea时能出现你说的效果哦。
      2021-07-15
      回复
    • 雪球
      雪球
      11-12
      请问最后有找到办法解决吗?我很疑惑为什么弹框上的catchtouchmove会导致弹框内的textarea无法滚动,理论上textarea是再弹框里的,touchmove事件是先到达textarea才对啊,那应该可以滚动的。但事实就是滚动不了
      11-12
      回复
登录 后发表内容