收藏
回答

scroll-view中的scroll-anchoring属性不生效是什么原因?

设置scroll-anchoring为true,向scrollView添加元素,列表中的旧的元素依然会被顶下去,而不是锚定在添加元素之前的位置,有没有scroll-anchoring的具体使用demo

下面是代码片段:

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


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

9 个回答

  • e🌈
    e🌈
    2020-12-01

    可以通过scroll-view 去调用 onPullDownRefresh 方法,然后将数据塞回scroll-view 中。

    注意点如下:

    1. scroll-view 中 列表渲染组件的key 必须不为数字,日期,最好为英文字符。
    2. scroll-view 当scrollTop <= upper-threshold的时候塞入数据无效


    解决方案:

    1. 维护一个类似组件的下拉刷新有一个refresher-triggered 的 property。
    2. 维护一个内部(所谓内部就是不加入渲染的状态)值当 upper-threshold<scrollTop<给定的threshold的时候置为true,否则置为false 。以下为 onscroll 处理方法:

    3.在页面中处理 refresh 事件, 如果你想要的话可以调用 wx.startPullDownRefresh 使页面出现动画效果。

    注意:在组件刷新的过程中必须要将 scroll-y 置为false:

    刷新完成后再置为true 即可

    2020-12-01
    有用 2
    回复 1
  • 小程序商城定制开发2600元全包
    小程序商城定制开发2600元全包
    2021-04-30

    我试了确实也不行,有解决方案么?求大佬

    2021-04-30
    有用 1
    回复
  • 西赛德李
    西赛德李
    2019-11-11

    在 wx:for 里设置有效的 wx:key 可以解决这个问题

    2019-11-11
    有用 1
    回复 5
    • Geory
      Geory
      2019-11-11
      加了wx:key还是不行,添加新数据还是会把旧数据顶下去
      2019-11-11
      回复
    • 西赛德李
      西赛德李
      2019-11-11回复Geory
      https://developers.weixin.qq.com/s/qoE6INms7Pcj 这我刚写的demo,试一下
      2019-11-11
      回复
    • Geory
      Geory
      2019-11-11回复西赛德李
      谢谢,看了一下一条一条的加确实没有问题,但是好像跟scroll-anchoring没有关系,因为我去掉这个属性他也不会被顶动,我再试试多条添加有没有问题
      2019-11-11
      回复
    • 西赛德李
      西赛德李
      2019-11-12回复Geory
      Android 上默认启用了锚定,所以去掉 scroll-anchoring 也没关系,但 iOS 上得显式写明 scroll-anchoring="{{true}}"   话说多条添加的效果怎么样?
      2019-11-12
      回复
    • Pinellia🍉
      Pinellia🍉
      2020-06-03回复西赛德李
      下拉加载的时候就没有效果了  适用场景聊天页面
      2020-06-03
      回复
  • 波子
    波子
    2020-09-23

    同样遇到顶部插入数据的需求,也是插入数据后,直接就是到顶部了。

    同求破法。

    2020-09-23
    有用
    回复
  • SPH
    SPH
    2020-08-24
    1. wx:for="{{list}}" list的item必须是obj, 2. scroll-top 不是0时生效
    2020-08-24
    有用
    回复
  • 小推车
    小推车
    2020-06-23

    这个问题很坑啊,这也不好用,那也不好用,唉

    2020-06-23
    有用
    回复 1
    • e🌈
      e🌈
      2020-12-01
      看看我的回复
      2020-12-01
      回复
  • 维塔斯的星星
    维塔斯的星星
    2019-12-16

    我试了确实也不行,有解决方案么?急~~~

    2019-12-16
    有用
    回复
  • 小白
    小白
    2019-10-22

    看下基础库版本,这个属性从基础库2.8.2开始支持

    另外,需要这样写:


    2019-10-22
    有用
    回复 2
    • Geory
      Geory
      2019-10-22
      好的,改过来发现还是不好用
      2019-10-22
      回复
    • Kin
      Kin
      2020-01-02
      试了一下,还是不生效哦,请问还有别的办法吗
      2020-01-02
      回复
  • lingk
    lingk
    2019-10-22

    仅在 iOS 下生效,安卓下可参考 CSS overflow-anchor 属性

    2019-10-22
    有用
    回复 1
    • Geory
      Geory
      2019-10-22
      ios也不行啊
      2019-10-22
      回复
登录 后发表内容
问题标签