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;
           }
        })
        
    }