微信小程序开发 scroll-view 实现锚点标记

微信小程序开发,使用 scroll-view 实现长页面的标记跳转

<scroll-view>容器的官网文档说明:

https://mp.weixin.qq.com/debug/wxadoc/dev/component/scroll-view.html

实现该功能主要使用 <scroll-view> 的 scroll-into-view 属性,但是官方文档中没有这个功能的演示,并且有一些重要的配置官方文档也并没有说明,下文是实际开发中的解决方案。

重点 :

设置 page 的 height : 100%;

设置 scroll-view 容器的高度,例如 height : 100%;

使用 scroll-view 容器做最外层

赋值 scroll-into-view,<scroll-view scroll-into-view="{{toView}}">

一定要给 scroll-view 设置方向属性 scroll-y="true"

跳转到位置的标记使用 id(定位),例如 <view id="mark1">

原文链接

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

推荐阅读更多精彩内容