【内推字节】欢迎简历chengxinsong@bytedance.com
vue 获取动态元素高度 ,发现获取为undefined
发布于 作者 superadmin 1689 次浏览 来自 分享

想要实时获取泳道的高度,然后我是这么写的

   <div class="lane already-list" v-if="listLaneByBoardId.length>0">
      <Lane ref="laneBox" v-for="(item,index) in listLaneByBoardId" :key="index" :listId="list.listId" :laneId="item.laneId" :options="options" :class="{'done': index%4 === 3}" class="kanban" :header-text="item.listName"/>
    </div>

使用ref

然后mouted()挂载的时候,

  mounted() {
    console.log(this.$refs.laneBox, '----------------------------------')
  }

输出这个高度,

发现最后输出的是undefined

然后去官方文档上找原因:

是因为我的模板是v-if动态加载,data初始化是空的,所以一开始模板并没有元素存在,所以undefined。。。然后我就把v-if删掉,就好使了。

思考:没有数据的时候div就不应该存在。。。这就是v-if存在的意义。。。
然鹅,把获取元素的代码放到请求数据成功后执行,这就很完美了。。。


发布评论
微信群
saucxs聊天机器人
saucxs
hi ,欢迎来到sau交流学习社区,欢迎与我聊天,问我问题哦!