主要用到 scroll-view 组件 scroll-into-view 属性;当点击导航菜单的时候,我们改变相应的 scroll-into-view 的值,并且同时需要在 scroll-view 组件内相应位置处的子元素上定义相应的 id;因为scroll-into-view 值应为某子元素 id,设置哪个方向可滚动,则在哪个方向滚动到该元素。
scroll-view 组件使用的一些注意点:
1. scroll-into-view 与 上面提到的子元素id 不能以数字开头
2.bindscroll 属性 实时监听滚动 ; 如上面 页面滚动到一定位置显示导航按钮功能
3.scroll-top 、scroll-left 属性: 设置竖向或者横向滚动条位置,如上面 返回顶部 功能
4.scroll-with-animation 属性:滚动平滑过渡,提高体验
5.如果需要隐藏 scroll-view 的滚动条使用 css ::-webkit-scrollbar{width: 0;height: 0;color: transparent;}
6.如果scroll-view占页面整个高度,可设置 scroll-view的高度 height:100vh , 设置height:100%无效 (vh:相对于视口的高度。视口被均分为100单位的vh)