uniapp 微信小程序 锚点跳转

uniapp文档

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

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

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

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

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

相关推荐
腾马科技42 分钟前
微信小程序餐饮扫码点餐小程序堂食外卖桌台自助下单源码
微信小程序·小程序
用户6990304848754 小时前
uniapp 构建本地txt跨平台小程序、h5、app通用
微信小程序·uni-app
weixin_lynhgworld5 小时前
打造绿色生活新方式——旧物二手回收小程序系统开发之路
java·小程序·生活
胡八一5 小时前
使用qianjkun uniapp 主应用 集成 vue微应用
前端·vue.js·uni-app
游戏开发爱好者85 小时前
基于uni-app的iOS应用上架,从打包到分发的全流程
android·ios·小程序·https·uni-app·iphone·webview
ᥬ 小月亮6 小时前
Uniapp中自定义导航栏
javascript·css·uni-app
苹果电脑的鑫鑫11 小时前
微信开发者工具中模拟调试现场扫描小程序二维码功能
小程序
vayy21 小时前
uniapp中 ios端 scroll-view 组件内部子元素z-index失效问题
前端·ios·微信小程序·uni-app
阿彬学java1 天前
Charles抓包微信小程序请求响应数据
微信小程序·小程序
傻傻有内涵的我1 天前
【微信小程序】分别解决H5的跨域代理问题 和小程序正常不需要代理问题
微信小程序·小程序