uniapp 微信小程序 锚点跳转

uniapp文档

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

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

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

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

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

相关推荐
V+zmm101342 小时前
基于微信小程序的乡村政务服务系统springboot+论文源码调试讲解
java·微信小程序·小程序·毕业设计·ssm
还这么多错误?!2 小时前
uniapp微信小程序,使用fastadmin完成一个一键获取微信手机号的功能
微信小程序·小程序·uni-app
_院长大人_2 小时前
微信小程序用户信息解密 AES/CBC/NoPadding 解密失败问题
微信小程序·小程序
IT 前端 张3 小时前
Uniapp 手机基座调试App 打包成Apk文件,并上传到应用商店
uni-app
User_undefined3 小时前
uniapp Native.js原生arr插件服务发送广播到uniapp页面中
android·javascript·uni-app
web135085886353 小时前
uniapp小程序使用webview 嵌套 vue 项目
vue.js·小程序·uni-app
麦兜*3 小时前
轮播图带详情插件、uniApp插件
前端·javascript·uni-app·vue
veminhe3 小时前
uni-app使用组件button遇到的问题
uni-app·vue
m0_748240023 小时前
uniapp跨平台开发---webview调用app方法
uni-app
guanpinkeji3 小时前
废品回收小程序:助力企业转型发展
小程序·小程序开发·小程序制作·回收·废品回收小程序·废品回收