vue 获取动态元素高度

2017.10.25凌晨
坑死了~因为要在页面中搞一个区域用来scroll列表,所以必须要获取scroll-wrap的高度,于是想尽办法获取swipe、navbarBox的高度

<div v-if="data[column]">
  <div class="columnPage" v-for='(item,index) in data' v-show='column == index'>
    <div class="swipe" ref="swipe" v-if='hotData.adList'> </div>
    <div class="navbarBox" ref="navbarBox" v-if='hotData.hasChild != 0'></div>
    <div class="scroll-wrap" ref="scrollwrap"></div>
  </div>
</div>

我在mounted里写百度上找到的方法,都没用。。。
这是别人成功例子,但是我不成功。。。。
在vue2.0里,如何获取dom元素的样式(样式是动态变化的)
nextTick试过,querySelector试过
但就是this.$refs有内容,this.$refs.xxx就undefined了。。。
好郁闷
最后我朋友发现问题,是因为我的模板是v-if动态加载,data初始化是空的,所以一开始模板并没有元素存在,所以undefined。。。然后我就把v-if该移位的移位,该删的删掉。。。

vue官方文档说明

其实这次主要的问题是html没写好。。。用的是以前的代码。。。哎,搞死人。。。


2017.10.25 11:09
突然明白v-if存在的意义,因为页面的显示内容是后台系统操作,所以,当没有数据的时候div就不应该存在。。。这就是v-if存在的意义。。。
然鹅,把获取元素的代码放到请求数据成功后执行,这就很完美了。。。
猜想:
v-if与ref不能再一起,可以使嵌套关系

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 这篇笔记主要包含 Vue 2 不同于 Vue 1 或者特有的内容,还有我对于 Vue 1.0 印象不深的内容。关于...
    云之外阅读 5,095评论 0 29
  • 下载安装搭建环境 可以选npm安装,或者简单下载一个开发版的vue.js文件 浏览器打开加载有vue的文档时,控制...
    冥冥2017阅读 6,123评论 0 42
  • 那还是庆幸它有处可以浪费 不然也不知道它该何去何从 太害怕长大承担责任了 不是彼得潘综合征吧 小时候老想着长大 正...
    没有橙汁阅读 290评论 0 0
  • 下午,天蓝蓝的,温润如玉的质感。没有一丝云,柔和的午后阳光轻轻洒在我们的身上。 我们全校师生在操场集中,即将排演明...
    秋笏笑月阅读 497评论 0 2
  • 追忆 幸福是什么 婉追苍茫暖意求,悦逐辽阔孤语留。 幸福是什么,幸福是感悟。 若似寒窗,一露飞似凝清霜,多么美丽!...
    鸢丶兮丶沫阅读 198评论 0 1