小程序问题日记一（scroll-view标签应用）

最新推荐文章于 2025-08-17 21:32:33 发布

原创最新推荐文章于 2025-08-17 21:32:33 发布 · 1.1k 阅读

0 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#scroll-view #小程序普通锚点

收录于

小程序问题日记专栏收录该内容

8 篇文章

订阅专栏

本文介绍如何使用scroll-view组件实现页面内的锚点滚动效果。通过设置toView属性指向目标元素的ID，或者直接设置scrollTop的数值来实现平滑滚动。需要注意的是toView的值必须为字符串形式且不能以数字开头。

scroll-view 实现普通锚点滚动

<scroll-view scroll-y scroll-into-view="{{toView}}" scroll-top="{{scrollTop}}" 

             style='height:calc(100% - 48px )' scroll-with-animation>

    这里放需要滚动的内容部分，锚点用id标注名称。
     跳转按钮可以写在外面也可以写在里面，用这个bindtap绑定函数，改变 "scrollTop" or "toView " 的值。
    toView 必须为字符串不能以数字开头，跳转ID名字不要带#
     scrollTop 距离顶部高度，单位px。
</scroll-view>

注意：这个标签里面不要放textarea标签，手机测试无法点中焦点。