uniapp 微信小程序 锚点跳转

uniapp文档

以下是我遇到的业务场景,是点击商品分类的某一类 然后页面滚动至目标分类,

首先第一步是设置锚点跳转的目的地,在目标的dom上面添加id属性

然后给每个分类每一项添加点击事件,分类这里的item数据里面有一字段是和上面商品dom设置的id值是一一对应的

下面是点击事件,我发现有两种方式可以实现锚点跳转,一个是直接通过给api配置selector参数就可以跳转至id元素处,另一个是先获取dom的top值,然后通过给api配置scrollTop值来实现页面滚动。

除了上面方式,其实还可以使用scroll-view,因为上面已经满足我的业务需求,故就不在此过多赘述,有兴趣的同僚可以试试scroll-view的实现方式。

相关推荐
前端开发小吴4 分钟前
微信小程序预览文件 兼容性苹果
微信小程序·小程序
Good Lucky20 分钟前
setData执行后操作方法-微信小程序
微信小程序·小程序·setdata
花开花落的博客24 分钟前
uniapp 不同路由之间的区别
前端·uni-app
七七小报25 分钟前
uniapp-商城-46-创建schema并新增到数据库
uni-app
Mr.app26 分钟前
uniapp自定义导航栏搭配插槽
uni-app
爱分享的程序员4 小时前
微信小程序执行C语言库的详细方案
c语言·微信小程序·小程序
Mark.10244 小时前
uniapp项目打包的微信小程序,设置uni-popup type=“bottom“时,底部有空隙
微信小程序·uni-app·notepad++
是程序喵呀4 小时前
uni-app使用web-view组件APP实现返回上一页
前端·uni-app
发呆小天才yy9 小时前
uniapp 微信小程序使用图表
前端·微信小程序·uni-app·echarts
Muxiyale13 小时前
微信小程序备案的一些记录
微信小程序·小程序