vue v-if 显示后元素自适应高度

vue v-if 隐藏元素后显示，需要重新激活元素，才能设置元素自适应高度，具体代码如下：

<template>
  <el-dialog
    title="图像浏览"
    :close-on-click-modal="false"
    width="70%"
    top="10px"
    :visible.sync="visible">
    <el-row>
      <el-col :span="24">
        <div v-if="divVisble" ref="element" :style="{ height: `${elementHeight}px` }"></div>
      </el-col>
    </el-row>
  </el-dialog>
</template>

<script>

  export default {
    data () {
      return {
        visible: false,
        divVisble: false,
        elementHeight: 700
      }
    },

    mounted() {
      this.$nextTick(() => {
        // 监听窗口大小变化
        window.onresize = () => {
          this.elementHeight = window.innerHeight - this.$refs.element.offsetTop;
        }
      })
    },
    methods: {
      init () {
        this.visible = true
        this.showDiv()
      },
      showDiv() {
        this.divVisble = true
        this.$nextTick(() => {
          this.$refs.element.focus();   //激活元素
          this.elementHeight = window.innerHeight - this.$refs.element.offsetTop;     //设置元素高度
        })
      },
    }
  }
</script>
<style>

</style>

《景岳全书》