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
	  })
  }
}) 
相关推荐
踩着两条虫1 分钟前
去“AI味儿”实操手册:从“机器脸”到“高级脸”,只差这三步!
前端·vue.js·ai编程
qq_2113874712 分钟前
基于LangGraph多agent
开发语言·前端·javascript·agent·langgraph
liuyao_xianhui16 分钟前
优选算法_模拟_替换所有的‘?‘_C++
开发语言·javascript·数据结构·c++·算法·链表·动态规划
摸鱼仙人~28 分钟前
Vue Todo 实战练习教程(简略版)
前端·javascript·vue.js
dzj88829 分钟前
云朵字生成器-html
前端·css·html·云朵字
FlyWIHTSKY34 分钟前
Vue 3 单文件组件加载顺序详解
前端·javascript·vue.js
周万宁.FoBJ35 分钟前
vue源码讲解之 reactive解析(仅proxy部分)
开发语言·javascript·ecmascript
乔磊36 分钟前
我开发了一个 Ralph CLI
javascript
霪霖笙箫40 分钟前
真授之以渔:我是怎么从"想给文章配几张图",一步步做出一个可发布 skill 的
前端·人工智能·开源
学习3人组42 分钟前
Uniapp快速上手了解
uni-app