vue设置元素高度自适应

VUE设置元素高度自适应

<div ref="element" :style="{ height: `${elementHeight}px` }"></div>

data(){
  return {
     elementHeight: 50
  }
},
    mounted:function(){
       this.$nextTick(() => {
           // this.$refs.element.$el.offsetTop：元素距离浏览器顶部的高度
           this.elementHeight = window.innerHeight - this.$refs.element.$el.offsetTop;
          
           // 监听窗口大小变化
           let context = this;
           window.onresize = () => {
              context.elementHeight = window.innerHeight - context.$refs.element.$el.offsetTop;
           }
        })
        
    }