vue获取dom元素

Question

希望获取每一个子元素的高度

html

    <div class="foods-wrapper" ref="foodsWrapper">

      <ul>

         <li v-for="item in goods" class="food-list food-list-hook">

           <h1 class="title">{{item.name}}</h1>

         </li>

      </ul>    

    </div>

vue逻辑

    mounted() {

      this.$nextTick(() => {

        this._calculateHeight()

      })

    },

    methods: {

      _calculateHeight() {

        let foodList = this.$refs.foodsWrapper.getElementsByClassName('food-list-hook')

        console.log(foodList)

        console.log(foodList.length)// 0

      }

_calculatrHeight中得到的foodList打印出来如下，length长度为9，但是并不能使用，打印foodList.Length长度为0，求指点

Answer 1

this.$nextTick放在你获取到goods数据并赋值之后// 获取数据this.getGoods().then(res => {&nbsp; &nbsp; this.goods = res.data&nbsp; // 赋值 触发响应式更新&nbsp; &nbsp; this.$nextTick(()=>{&nbsp; // DOM更新之后获取子元素&nbsp; &nbsp; &nbsp; &nbsp; this._calculateHeight()&nbsp; &nbsp; })})

Answer 2

你console 是在哪console的?别的函数内部?你用let 声明? 别的肯定不能访问