收藏
回答

scroll-view组件内部的元素使用position:fixed定位,会随着scroll一起滚动

框架类型 问题类型 API/组件名称 终端类型 微信版本 基础库版本
小程序 Bug scroll-view 微信iOS客户端 8.0.11 2.19.4

当scroll-view组件开启了下拉刷新功能之后,在组件内部使用了position:fixed定位的元素,期待的结果是fixed元素固定在屏幕上不会随页面滑动而移动,实际情况是在滑动页面时,fixed元素也会跟着滚动,如果把元素移出scroll-view就正常了,问题是fixed元素是在scroll-view里的组件里使用的,无法移出。

该问题只在scroll-view开启下拉刷新功能情况下出现

希望官方及时处理

回答关注问题邀请回答
收藏

6 个回答

  • 友情出演
    友情出演
    2022-01-14

    这是CSS3的特性,position:fixed 会被transform副作用降级为absolute。

    如果要在scroll-view中做下拉刷新就不要有fixed的元素,如果要有下拉刷新,就用页面滚动刷新onPullDownRefresh。

    官方文档也说了这个的:https://developers.weixin.qq.com/miniprogram/dev/component/scroll-view.html [bug & tip]

    2022-01-14
    有用 2
    回复 2
    • 西瓜🍉
      西瓜🍉
      2022-07-26
      是因为scroll-view添加下拉刷新属性后,会在元素中添加transform属性吗?但是在审查元素的时候在scroll-view元素,下面没有发现transform属性呀
      2022-07-26
      回复
    • Veaxe、
      Veaxe、
      04-10
      问题关键应该是微信小程序编译导致的,浏览器编译出来的刷新动画元素和内容元素并不在同一级,而微信小程序在同一级。用root-portal单独抽离出来或者不包含在scroll-view里就可以了
      04-10
      回复
  • 千白
    千白
    2023-04-25

    用root-portal

    https://developers.weixin.qq.com/miniprogram/dev/component/root-portal.html

    2023-04-25
    有用 1
    回复 3
    • 。
      2023-10-11
      我的效果本来是在文档流里滚动到上面吸到顶部,enable=false的时候无效,后来用的sticky
      2023-10-11
      回复
    • 落风
      落风
      2023-10-13
      portal 理论上跟dom层级无关,事实上我的经验是依赖于 portal 的组件不能嵌套,比如一个 Modal 中放一个 Popover 一类的
      2023-10-13
      回复
    • 浮世绘
      浮世绘
      2023-11-17
      感谢分享,很有用
      2023-11-17
      回复
  • Feynman
    Feynman
    2023-12-27

    还有4天就2024年了,还没解决吗?开发者只能通过这种hack方式解决,很难受啊

    2023-12-27
    有用
    回复
  • 山野村夫
    山野村夫
    2023-01-28

    2023 年正月初七前来观望,有解决方案吗?

    2023-01-28
    有用
    回复
  • liuwx
    liuwx
    2021-11-18

    怎么样兄弟,咋解决的,各种方法都试了

    2021-11-18
    有用
    回复 2
    • 蹦、沙卡拉卡
      蹦、沙卡拉卡
      2021-12-08
      一样的问题
      2021-12-08
      回复
    • 默默牵挂
      默默牵挂
      2021-12-24
      没解决,只能先把下拉刷新去掉了
      2021-12-24
      回复
  • 海蓝时见鲸
    海蓝时见鲸
    2021-09-09

    2021-09-09
    有用
    回复
登录 后发表内容