在vue中父元素设置min-heigt，子元素设置height:100%,没法自适应高度///vue中获取动态元素的宽高值

<template>
  <div class="toast" ref="wrapper">
    <slot v-if="!enableHtml"></slot>
    <div v-else v-html="$slots.default"></div>
    <template v-if="closeButton">
      <div class="line" ref="line"></div>
      <span class="close" @click="onClickClose">{{closeButton.text}}</span>
    </template>
  </div>
</template>

  mounted() {
  	//解决方法 this.$nextTick  与  getBoundingClientRect()
    this.$nextTick(()=>{
      this.$refs.line.style.height=`${this.$refs.wrapper.getBoundingClientRect().height}px`
    })
  },

执行 this.$refs.wrapper.getBoundingClientRect()
获取到

x: 681.4140625
y: 0
width: 540.171875
height: 40
top: 0
right: 1221.5859375
bottom: 40
left: 681.4140625