Vue获取分发内容的宽度

Vue在需要获取分发内容的宽度（内容不换行的情况下）

子组件有默认的内容（即在父组件没有分发内容时也会有内容）例：

<span id="detial">
  <slot>这里是子组件默认内容</slot>
</span>

<father>
   <son>父组件分发到子组件的内容</son>
</father>

直接在子组件mounted函数中获取时获取不到detial正确的值：

document.getElementById("detial").offsetWidth

此时的offsetWidth为父组件分发内容到子组件之前子组件渲染的内容的宽

若获取父组件分发内容到子组件渲染后的宽度值

this.$nextTick(function(){    
   document.getElementById("detial").offsetWidth;
})




即在渲染完成之后再获取分发槽内容宽度，，此时是正确的宽度