uni-app获取元素具体位置获取失败

场景:想要通过链接跳转传递catid&catid2类别id,商品类别id 跳到这一页左侧对应的类别栏上面,同时跳到右侧列表滚动到对应商品那一块区域。

遇到的问题:在for循环中通过绑定id获取不到商品列表的具体位置。

原因:在onReady函数和mounted函数中没有获取到接口返回的数据,所以id那会还没渲染上。

解决方法:id换成ref,在接口返回成功的then函数中,使用$nextTick函数获取元素。

在for循环绑定ref的时候,获取ref需要加上[0]

复制代码
then(() => {
	 if (this.secondId2) {
	  this.$nextTick(() => {
	      let cid = this.secondId2
	      const node = this.$refs[cid][0]
	      this.scrollTop = node.$el.offsetTop
	  })
  }
}) 
相关推荐
pusheng2025几秒前
普晟传感2026年新春年会总结与分析
前端·javascript·html
谢尔登2 分钟前
React19事件调度的设计思路
前端·javascript·react.js
Emma_Maria12 分钟前
本地项目html和jquery,访问地址报跨域解决
前端·html·jquery
奋斗吧程序媛17 分钟前
常用且好用的命令
前端·编辑器
2301_7965125221 分钟前
【精通篇】打造React Native鸿蒙跨平台开发高级复合组件库开发系列:Lazyload 懒加载(懒加载的图片)
前端·javascript·react native·react.js·ecmascript·harmonyos
敲敲了个代码26 分钟前
从N倍人力到1次修改:Vite Plugin Modular 如何拯救多产品前端维护困境
前端·javascript·面试·职场和发展·typescript·vite
摘星编程30 分钟前
OpenHarmony环境下React Native:Timeline时间轴组件
javascript·react native·react.js
摘星编程32 分钟前
在OpenHarmony上用React Native:Timeline水平时间轴
javascript·react native·react.js
Yff_world34 分钟前
网络安全与 Web 基础笔记
前端·笔记·web安全
Sapphire~35 分钟前
Vue3-19 hooks 前端数据和方法的封装
前端·vue3